イラスト・ロゴ・WEB制作からWEBディレクター養成講座
メニュー
TOP
WEBデザイナー養成講座
WEBディレクター養成講座
GALLERYはこちらから
メニュー
イラスト・ロゴ・WEB制作ご依頼の方
WEB講座

【JAVASCRIPT TIPS】

JavaScriptのサンプルソースです。
htmlファイルに貼り付けて使ってください。
*今後もどんどん増やしていく予定です。

■ウインドウ関係

◇大きさを指定して別ウインドウを開く

sample file

<html>
<head>
<title>別ウインドウを開く</title>
<script Language="JavaScript">
<!--
// 大きさを指定して別ウィンドーを開く
//赤字はファンクションの名前(変更可)
function sample02()
{
WindowOpen =
window.open("sample_02_open.html","","Width=400,Height=400") ;
}
// -->
</script>
</head>
<body>
<A HREF="JavaScript:sample02();">リンク</A>
</body>
</html>

◇画面いっぱいにウインドウが開く

sample file

<html>
<head>
<title>画面いっぱいにウインドウが開く</title>
<script Language="JavaScript">
<!--
// ウィンドウの位置を、モニタの右上(0,0)の座標へ移動
moveTo(0,0);
// ウィンドウサイズを、モニタサイズと同じサイズに変更
resizeTo(screen.width,screen.height);
// -->
</script>
</head>
<body>
</body>
</html>

◇ウインドウを指定した位置へ移動

sample file

<html>
<head>
<title>ウインドウを指定した位置へ移動</title>
<script language="JavaScript1.2">
<!--
function MVto(){ window.moveTo(100,100) }
//-->
</script>
</head>
<body bgcolor="#FFFFFF">
ウインドウを指定した位置へ移動<br>
(画面の左上の角を基準)
<p>
<form>
<input type="button" value="移動します"
onClick="MVto()">
</form>
</p>
</body>
</html>

◇リンク先をフルスクリーンで表示

sample file

ファイル1
<html>
<head>
<title>リンク先をフルスクリーンで表示</title>
</head>
<script Language="JavaScript">
<!-- // 簡単JavaScript作成
// リンク先をフルスクリーンで表示
function fullscreen1()
{
WindowOpen =
window.open('sample_05_01.html','_blank','fullscreen=1') ;
}

// -->
</script>

<body>
<a href="JavaScript:fullscreen1();">フルスクリーンで表示</a>
</body>
</html>

ファイル2
<html>
<head>
<title>このファイルが開きます</title>
</head>
<body>
<!--メニューバーが消えるので「閉じる」ためのボタンか
テキストは、必ずいれる-->
<a href="JavaScript:close();">close</a>
<br>
<br>
<br>
<p>表示されましたか?</p>
</body>
</html>

■ブラウザ関係

◇ブラウザ専用ページに振り分ける

sample file

<html>
<head>
<title></title>
<script language="JavaScript">
<!--
function GoPege() {
if( navigator.appName.charAt(0)=="N" ){
if(navigator.appVersion.charAt(0)==2){
location.href = "NN2.html" }
if(navigator.appVersion.charAt(0)==3){
location.href = "NN3.html" }
if(navigator.appVersion.charAt(0)==4){
location.href = "NN4.html" }
if(navigator.appVersion.charAt(0)==5){
location.href = "NN6.html" }
}
if( navigator.appName.charAt(0)=="M" ){
if(navigator.appVersion.charAt(0)==2){
location.href = "IE3.html" }
if(navigator.appVersion.charAt(0)==3){
location.href = "IE3.html" }
if(navigator.appVersion.charAt(0)==4){
if (navigator.appVersion.indexOf("MSIE 5") != -1) {
location.href = "IE5.html" }
else {
if (navigator.appVersion.indexOf("MSIE 6") != -1) {
location.href = "IE6.html" }
else { location.href = "IE4.html" }
}
}
}
}
//-->
</script>
</head>
<body>
ブラウザ専用ページに振り分け
<p>
ブラウザ判別中...
<script language="JavaScript">
<!--
GoPege()
//-->
</script>
</body>
</html>

TOP へ→