| ちらっと小窓君 ver.1.4 |
||||
◆サンプル |
||||
| ＜機能と特徴＞ ・リンク先を小さいウインドウで開くスクリプトです ・ウインドウサイズの指定も可能です |
||||
 |
|
|
|
|
 |
|
| 公開日 | 2002.1.18 | ||
| 最終更新日 | 2002.10.24 | ||
| バージョン | ver.1.4 | ||
| 動作確認 | IE6.0,NN4.7,NN7.0,Opera7.0 | ||
| cookie | 不使用 | ||
| CSS | 使用 | ||
| 更新履歴 | 2002.06.15 | ver.1.1 | ウインドウを開いた状態で再度ボタンを押した場合に
ウィンドウがアクティブになる(最前面に来る)ように改良(変更点：ソース１) ボタンを連打すると複数のウィンドウが開いてしまう点を改善(変更点：ソース１) |
| 2002.07.08 | ver.1.2 | 開くウインドウの名前を指定できるように改良(変更点：ソース１) | |
| 2002.10.24 | ver.1.3 | 同一の名前のウインドウを複数のウィンドウから呼び出した場合 最後に呼び出したウィンドウを 親ウィンドウと認識するように改良(変更点：ソース１) | |
| 2003.06.15 | ver.1.4 | 同一ページ内の複数設置に対応(変更点：ソース１) | |
 |
|
|
|
|
|
|
||
| 初心者向け解説 | 中級者向け解説 | ダウンロード | ||||
|
|
|
||||
|
１．カスタマイズフォームを使って設定をしてください。 ２．ソース１を<head>〜</head>の間に書き込んでください。 ３．ソース２を<body>〜</body>の間の 画像を表示したい位置に書き込んでください。 ４．ブラウザでテストしてみてください。 正常にウィンドウが開けば設置は完了です。 |
||||||
|
|
|||||
 |
|
|
|
|
|
|
||
| カスタマイズフォーム | 補足説明 | 改造方法 | ||||
|
|
|
|
|
|
|
|
■ウィンドウの名前
ウィンドウの名前を指定しておくと 開いたウィンドウに名前がつけられます。 同じ名前を指定してウィンドウを開こうとした時 そのウィンドウに対してジャンプさせたりすることができます。 ウィンドウの名前を省略した場合、 リンクをクリックするたびに新しいウィンドウを開きます。
■ウィンドウのサイズ
100以下の数字も指定は出来ますが、 ほとんどのブラウザでは100以下を指定した場合 ウィンドウサイズは100で表示されます。 |
||||||
|
|
|||||
|
|
|
|
|
||
| カスタマイズフォーム | 補足説明 | 改造方法 | ||||
|
|
|
|
|
||
|
■開くウィンドウの大きさを変更する。(半角数字：正の整数) //設定〜//ここまでの２〜３行目を変更してください。 ２行目がウィンドウの横幅、３行目が縦幅です。 w_x = 210; w_y = 120;■スクロールバーの有無を変更する。 //設定〜//ここまでの４行目を変更してください。 表示するなら『yes』、表示しないなら『no』を指定します。
w_bar = 'no';
■ウィンドウの名前を変更する。(半角英数字)//設定〜//ここまでの５行目を変更してください。
w_id = 'komado_win';
■ウィンドウを開くリンクを複数にする。ソース２の使用したい方を表示したい位置に書き込んでください。 この時にリンク毎に設定をする場合は komadokun()関数の引数を指定してください。 第一引数から順に『開くファイルのパス』『ウィンドウの横幅』 『ウィンドウの縦幅』『スクロールバーの有無』『ウィンドウの名前』になります。 該当の引数がない場合は//設定〜//ここまでの設定に従います。 以下にonClickでkomadokun関数を呼び出す場合での例を示します。 例：ファイルのパスのみを個別に設定する
onClick="komadokun('komadotyan.html')";
例：ファイルのパス、ウィンドウの名前を個別に設定する。(設定しない引数のスペースも必ず取ってください。)
onClick="komadokun('komadotyan.html','','','','komado_win2')";
例：ウィンドウの大きさを個別に設定する。
onClick="komadokun('','320','300')";
|
||||||
|
|
|||||
 |
 |
|
|
■ソース１(以下のソースを<head>〜</head>の間に書き込んでください) | |
<script language="JavaScript" type="text/javascript">
<!--//Script Created by あう,http://www5c.biglobe.ne.jp/~horoau/
//ver.1.4
//設定
w_url = 'komadokun.html'; //小窓で開くファイルのパス
w_x = 210; //ウィンドウの横幅
w_y = 120; //ウィンドウの縦幅
w_bar = 'no'; //スクロールバーの有無
w_id = 'komado_win'; //ウィンドウの名前
//ここまで
function komadokun(w_url2,w_x2,w_y2,w_bar2,w_id2)
{if(!w_url2){w_url2 = w_url}
if(!w_x2) {w_x2 = w_x;}
if(!w_y2) {w_y2 = w_y;}
if(!w_bar2){w_bar2 = w_bar;}
if(!w_id2) {w_id2 = w_id;}
w_komado = open(w_url2,w_id2,"width="+w_x2+",height="+w_y2+",resizable=yes,scrollbars="+w_bar2);
w_opener = Math.random();
if(w_opener != w_komado.opener.w_opener)
{w_komado.close();
komadokun();}
w_komado.focus();
return false;}
// -->
</script>
|
■ソース２(以下のソースを<body>〜</body>の間に書き込んでください) | |
<!--1個目のウィンドウを開くリンク-->
<form>
<input type="button" value="小窓を開く" onClick="komadokun('','','','','')">
</form>
 |
|