スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

URL短縮とスタイルシートでソースがすっきり

 ライブドアでしか動作しないソースですが、URL短縮とスタイルシートを少しだけ利用しただけで、先日投稿したソースが以下のように見やすくなります。


<style>
.gazou {
position:absolute;
left:0px;
top:0px;
width:500px;
height:400px;
visibility:hidden;
}
</style>

<SCRIPT TYPE="text/javascript">
<!--
var pnum=0;
var henkanchu=0;
var mode=0;
var pos=0;

function openint() {
pos+=50;
husuma_L.style.left=-pos;
husuma_R.style.right=-pos;
if(pos==250) {
clearInterval(open_int);
henkanchu=0;
}
}
function closeint() {
pos-=50;
husuma_L.style.left=-pos;
husuma_R.style.right=-pos;
if(pos==0) {
clearInterval(close_int);
pnum++;
if(pnum>8) pnum=0;
for(i=0; i<9; i++)
document.getElementById('p_idkey'+i).style.visibility='hidden';
document.getElementById('p_idkey'+pnum).style.visibility='visible';
henkanchu=0;
}
}
function hiraku() {
henkanchu=1;
open_int=setInterval('openint()',100);
}

function tojiru() {
henkanchu=1;
close_int=setInterval('closeint()',100);
}

function open_door() {
if(henkanchu==1) return;
if(mode==0){
hiraku();
mode=1;
}
else {
tojiru();
mode=0;
}

}
// -->
</SCRIPT>

<center>
<div style="position:relative; width:500px; height:400px; font-size:0px; color:white; overflow:hidden; ">
<img src="http://goo.gl/ss4R" style="position:absolute; top:-20px; left:-20px; width:600px; height:450px; z-index: 98; "/>
<img src="http://goo.gl/4NW4" id="husuma_L" style="position:absolute; left:0px; top:0px; width:250px; height:400px; z-index:99; " />
<img src="http://goo.gl/4NW4" id="husuma_R" style="position:absolute; right:0px; top:0px; width:250px; height:400px; z-index:99; " />
<img id="p_idkey0" src="http://goo.gl/7XZ5" class="gazou" style="visibility:visible;"/>
<img id="p_idkey1" src="http://goo.gl/kzGi" class="gazou" />
<img id="p_idkey2" src="http://goo.gl/JbTy" class="gazou" />
<img id="p_idkey3" src="http://goo.gl/p9jc" class="gazou" />
<img id="p_idkey4" src="http://goo.gl/myEZ" class="gazou" />
<img id="p_idkey5" src="http://goo.gl/39de" class="gazou" />
<img id="p_idkey6" src="http://goo.gl/a6xX" class="gazou" />
<img id="p_idkey7" src="http://goo.gl/rQ47" class="gazou" />
<img id="p_idkey8" src="http://goo.gl/EtsT" class="gazou" />
</div>
<a href="#dummy" onclick="open_door();">障子を開けたり閉めたりする</a>
</center>

コメントの投稿

非公開コメント

FC2カウンター
プロフィール

dongwcat

Author:dongwcat
FC2ブログへようこそ!

最新記事
最新コメント
最新トラックバック
カテゴリ
検索フォーム
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる

QRコード
QRコード
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。