スポンサーリンク
ブログのヘッダ画像を一定秒数ごとに変更するスクリプト。
皆様、こんにちは。週末をいかがお過ごしですか?
ブログ右下に設置している投票フォームにご投票くださった方、ありがとうございます。
この投票「このブログのヘッダ画像はどっちがいいっすか? 」は今月末まで受け付けています。
ここまでの途中結果です。
(結果を見てからこの画面に戻るにはブラウザの戻るボタンをお使いください。右上の赤いのを押して窓を閉じるとこの画面は残っていません)
かわいい仔犬 | 4票 |
エロいねーちゃん | 1票 |
残念ながら「エロいねーちゃん」が劣勢です。
しかしみなさん、考えてみてください!
彼女は人間です。人間の彼女が、ただエロいというだけで犬以下の扱いをされているのです!
本当にそれでいいのでしょうか?
もしかしたら子犬ばかりが表示されているのがいけないのでは?
そこで、投票期間の間、均等に犬と彼女を表示することにしました。
5秒おきに入れ替わります。
一定期間で背景が変わるスクリプト
<script type="text/javascript"> var changeBG=function(id,interval){ var imgs=[ 'http://fanblogs.jp/ayzfqir5/file/152/aGVhZGVya10.jpg', 'http://fanblogs.jp/ayzfqir5/file/152/aGVhZGVyLWJnYlM.jpg' ]; //切り替わる画像のURL(2枚より多くても可) var cnt=imgs.length; var n=0; var elem=document.getElementById(id); if(elem){ var sub=function(){ elem.style.background="url('"+imgs[n]+"')"; n=++n%cnt?n:0; }; elem.style.background="url('"+imgs[n++]+"')"; setInterval(sub,interval*1000); } }; window.onload=function(){ changeBG('header',5);
//changeBG(‘ヘッダのid(ファンブログの場合は、おそらくheader)‘,秒数);
}
</script>
このまま<head>と</head>の間に貼り付ければ、今ご覧のヘッダが5秒おきにお楽しみいただけます。あるいは、スクリプトの画像URL、ヘッダのid、切り替えたい秒数の3つを変えてお使いください。
すでにheadにwindow.onloadがある場合は、上のwindow.onloadの中身をheadのwindow.onloadの中に貼り付けてください。
うごかねー、とか画像のサイズが合わないとかは下のコメントで聞いてね。
関連コンテンツ
スポンサーリンク
面白そうですね。
やってみたいけれど、ヘッダーの画像やソースをいじっているから うまく 出来ないと思います・・(;_;)