TOP 
Web
ウィンドウ操作 |
〆 選択ボックスからリンク先にジャンプする
|
|||
@directlink.html<head> <title> ...... </title> <script type="text/javascript"> <!-- //初期設定 //"blank":新規WindowでLinkを開く, "":(指定しない場合)そのままLinkを開く var target = ""; function MyJump(){ var url = document.form.select.options[document.form.select.selectedIndex].value; if(url != "" ){ if(target == ""){ window.open(url, "window_name"); } else{ location.href = url; } } } //--> </script> </head> <body> <form name="form"> <select name="select" onChange="MyJump()"> <option value="" selected>選択してください</option> <option value="../html/es_html01.html">HTML</option> <option value="../css/es_css01.html">CSS</option> <option value="../XX/LinkXX.html">?????</option> <option value="../XX/LinkXX.html">?????</option> </select> </form> </body> |
JavaScript
〆 別ウインドウ表示で、ブラウザのツールバー、メニューを非表示にする
|
|||
@directlink.html<head> <title> ...... </title> <script type="text/javascript"> <!-- function NoToolbarWindow(url){ win=window.open(url,"host","scrollbars=1,location=1,width=780,height=540"); } //--> </script> </head> <body> <a href="./photo01.html" onClick="NoToolbarWindow('./photo01.html'); return false;">ツールバーのないウィンドウを表示</a> </body> |
|||
window.open()のその他オプションscrollbar ：スクロールバーの有無
menubar ：メニューバーの有無
toolbar ：ツールバーの有無
location ：ロケーションバー(URL)の有無
(セキュリティの関係上 URLは表示(１に設定)することをお勧めします)
directories ：ディレクトリバーの有無
status ：ステータスバーの有無
resizable ：リサイズ可否(ウインドウサイズ変更)
width ：横幅(pixels、最小100)
height ：縦幅(pixels、最小100)
|
〆 ブラウザ履歴を残さずに新しいウィンドウへ(テキストリンク)
|
|||
<body>
<a href="javascript:location.replace('./js_sample/photo01.html')" title="">
履歴を残さないテキストリンク</a>
</body>
|
〆 ブラウザ履歴を残さずに新しいウィンドウへ(ボタンリンク)
|
|||
<head> <title> ...... </title> <script type="text/javascript"> <!-- function NoHistory(){ location.replace("./link01.html"); } //--> </script> </head> <body> <form> <input type="button" value="履歴を残さないボタンリンク" onClick="NoHistory(); return false;"></input> </form> </body> |
〆 ブラウザ制御用ボタンの作成
|
|||
<body> <form> <input type="button" value="Go Back" onClick="history.back();"> </input> <input type="button" value="Go Forward" onClick="history.forward();"> </input> <input type="button" value="Close" onClick="window.close();"> </input> </form> </body> |
〆 ブラウザ制御用リンクの作成
|
|||
<body>
<form>
<a href="javascript:history.go(-2);">2つ前のページへ戻る</a>
<a href="javascript:history.go(-1);">1つ前のページへ戻る</a>
<a href="javascript:history.go(1);">1つ後のページへ戻る</a>
<a href="javascript:window.close();">Windowを閉じる</a>
</form>
</body>
|
〆 警告用ダイアログボックスを開く
|
|||
<body>
<form>
<input type="button" value="Alert" onClick="window.alert('Open Alert')">
</input>
</form>
</body>
|
〆 選択ダイアログボックスを開く
|
|||
<head> <title> ...... </title> <script type="text/javascript"> <!-- function MyConf(){ if(window.confirm("あなたは、今、幸せですか？")){ window.alert("よかったですね。お幸せに♪"); }else{ MyConf(); } } //--> </script> </head> <body> <form> <input type="button" value="確認" onClick="MyConf()" </input> </form> </body> |
〆 ブラウザの自動スクロール
※IE7だと動かないかも。
|
|||
<title></title>
<script type="text/javascript">
// 初期設定
var speed = 180; // スクロールスピード（1に近いほど速く）
var move = 5; // スクロールのなめらかさ（1に近いほどなめらかに）
// 初期化
var x = 0;
var y = 0;
var tmpx = 0;
var tmpy = 0;
function AutoScrollV(){
// スクロール処理
window.scrollBy(0, move);
var rep = setTimeout("AutoScrollV()", speed);
// スクロール位置をチェック（IE用）
if(document.all){
x = document.body.scrollLeft;
y = document.body.scrollTop;
}
// スクロール位置をチェック（NN用）
else if(document.layers || document.getElementById){
x = pageXOffset;
y = pageYOffset;
}
if(tmpx == x && tmpy == y){
clearTimeout(rep);
}else{
tmpx = x;
tmpy = y;
}
}
</script>
<body onLoad="AutoScrollV();">
//スクロールさせる本文
</body>
|
The link to this site is free. /
Last Updated : 28.May.2012