|
|
| 小窓を開けてください 小窓アラカルトは上の小窓のことではありません。リンクをクリックした時に表示されるnew windowです。 このwindowはＨＰビルダーで作成したものです。ソースは下記になります。 <A href="mizutama/taki.jpg" target="_blank" >new window</A> 画像と画像の場合は <A href="リンク先画像.gif" target="_blank"><IMG src="リンク元画像.gif" width="××" height="××" border="0"></A> ＨＴＭＬだけでは小窓のサイズや表示位置を指定したり、複数のウインドウを操作することができません。 そこで、Ｊａｖａスクリプトを使ってこんなことまでやってしまいましょう。小窓アラカルトへ→ その前に上の窓が開いて水玉が落ちてくるスクリプトの説明です。 javascript(by ijichi)さんのオリジナルJavaScript事例集（窓外9）窓外独自画像降改２です。 ソースは窓外独自画像降改２のソースを表示させてコピペします。 画像は著作権が違うのでこちらでダウンロードしてください。 スクリプトはＨＥＡＤ内にペースト。 gazx=130;//画像の位置、横方向。（中央表示の場合は100） gazy=40;//画像の位置、縦方向。 （同） //doc_width = document.body.clientWidth; //←中央表示の時//を削除 //doc_height = document.body.clientHeight;//←中央表示の時同 //gazy=document.body.scrollTop+doc_height/2-yh/2;//←中央表示の時同 //gazx=document.body.scrollLeft+doc_width /2-xw/2;//←中央表示の時同 ＢＯＤＹ内に以下をコピペ onLoad="star();madoaki()" topmargin="0" leftmargin="0" 以下をコピペして修正 <IMG name="myimg21" src="mizutama/taki.jpg" style="DISPLAY: none; LEFT: 0px; POSITION: absolute; TOP: 0px;z-index:1;"> 写真です。窓枠が写真のサイズ（242×184ピクセル）になるので大き目は不可。 画像編集ソフトでサイズ変更→解像度サイズは14.57×11.08以下で切り取りも可。 <div id="dot1" ・・・・・ <IMG src="mizutama/mizu1.gif"> 振ってくる画像です。２種類有るので適当に散らばす。 <IMG name="myimg22" src="waku2.gif" style <IMG name="myimg23" src="madoh2.gif" style <IMG name="myimg23" src="madoh2.gif" style（同じ画像が右側に来ます） なお、最初に述べたＨＴＭＬで閉じた窓と窓の開くページを同じウインドウにリンクさせています。 小窓基礎編はこちら   |
|
|