オリンピック仕様のタイトルバナーにしてみました


このエントリーをはてなブックマークに追加

ここからちょっと広告です。

広告は以上です。

オリンピックが、僕の中で予想以上の盛り上がりを見せているので、「小鳥(a little bird)」をオリンピック仕様にしてみました。

ちょっと自慢していいですか? リロードするたびに、タイトルの背景画像が変わります
超可愛い! ガンガンリロードしてサーバーに負荷かけまくり!

画像は、「インドア派が、一生懸命考えたオリンピック」で紹介したgifアニメを使っています。

以下、興味を持った奇特なあなたも使えるように、ソースをご案内します。

このJavaScriptは、どなたでも使うことができます。別に著作権とか主張する気はありません。
ソースは以下の通り。


<script language="JavaScript">
<!--

bcimg = new Array
bcimg[0] = "http://www.cocolog-nifty.com/cocolympic/banner/archery700.gif";
bcimg[1] = "http://www.cocolog-nifty.com/cocolympic/banner/badminton700.gif";
bcimg[2] = "http://www.cocolog-nifty.com/cocolympic/banner/baseball700.gif";
bcimg[3] = "http://www.cocolog-nifty.com/cocolympic/banner/basketball700.gif";
bcimg[4] = "http://www.cocolog-nifty.com/cocolympic/banner/boxing700.gif";
bcimg[5] = "http://www.cocolog-nifty.com/cocolympic/banner/canoe700.gif";
bcimg[6] = "http://www.cocolog-nifty.com/cocolympic/banner/cycling700.gif";
bcimg[7] = "http://www.cocolog-nifty.com/cocolympic/banner/equestrian700.gif";
bcimg[8] = "http://www.cocolog-nifty.com/cocolympic/banner/fencing700.gif";
bcimg[9] = "http://www.cocolog-nifty.com/cocolympic/banner/five700.gif";
bcimg[10] = "http://www.cocolog-nifty.com/cocolympic/banner/floor700.gif";
bcimg[11] = "http://www.cocolog-nifty.com/cocolympic/banner/handball700.gif";
bcimg[12] = "http://www.cocolog-nifty.com/cocolympic/banner/hockey700.gif";
bcimg[13] = "http://www.cocolog-nifty.com/cocolympic/banner/horizontalbar700.gif";
bcimg[14] = "http://www.cocolog-nifty.com/cocolympic/banner/horsemanship700.gif";
bcimg[15] = "http://www.cocolog-nifty.com/cocolympic/banner/judo700.gif";
bcimg[16] = "http://www.cocolog-nifty.com/cocolympic/banner/marathon700.gif";
bcimg[17] = "http://www.cocolog-nifty.com/cocolympic/banner/polevault700.gif";
bcimg[18] = "http://www.cocolog-nifty.com/cocolympic/banner/pommel700.gif";
bcimg[19] = "http://www.cocolog-nifty.com/cocolympic/banner/relay700.gif";
bcimg[20] = "http://www.cocolog-nifty.com/cocolympic/banner/rowing700.gif";
bcimg[21] = "http://www.cocolog-nifty.com/cocolympic/banner/sailing700.gif";
bcimg[22] = "http://www.cocolog-nifty.com/cocolympic/banner/shooting700.gif";
bcimg[23] = "http://www.cocolog-nifty.com/cocolympic/banner/shotput700.gif";
bcimg[24] = "http://www.cocolog-nifty.com/cocolympic/banner/soccer700.gif";
bcimg[25] = "http://www.cocolog-nifty.com/cocolympic/banner/softball700.gif";
bcimg[26] = "http://www.cocolog-nifty.com/cocolympic/banner/sprint700.gif";
bcimg[27] = "http://www.cocolog-nifty.com/cocolympic/banner/swimming700.gif";
bcimg[28] = "http://www.cocolog-nifty.com/cocolympic/banner/synchro700.gif";
bcimg[29] = "http://www.cocolog-nifty.com/cocolympic/banner/tabletennis700.gif";
bcimg[30] = "http://www.cocolog-nifty.com/cocolympic/banner/taekwondo700.gif";
bcimg[31] = "http://www.cocolog-nifty.com/cocolympic/banner/tennis700.gif";
bcimg[32] = "http://www.cocolog-nifty.com/cocolympic/banner/triathlon700.gif";
bcimg[33] = "http://www.cocolog-nifty.com/cocolympic/banner/triple700.gif";
bcimg[34] = "http://www.cocolog-nifty.com/cocolympic/banner/volleyball700.gif";
bcimg[35] = "http://www.cocolog-nifty.com/cocolympic/banner/walk700.gif";
bcimg[36] = "http://www.cocolog-nifty.com/cocolympic/banner/weight700.gif";
bcimg[37] = "http://www.cocolog-nifty.com/cocolympic/banner/wrestling700.gif";

rnd = Math.floor(Math.random() * bcimg.length);
document.write("<style type='text/css'>#banner {background: url('",bcimg[rnd],"') no-repeat; height: 100px; padding:0px; background-color: #227744; text-align: right;} #banner h1 {padding: 15px;} #banner h2 {padding-right: 15px;}</style>");

//-->
</script>

これを、</head>タグの直前ぐらい? に書いておけば、オッケーです。

なんかちょっとプログラマーになった気分でかっちょいいんですけど……きっと何か勘違いをしているんでしょうね(泣)。

athene2004082401

Ads by Google

コメント

コメントは、Twitterやはてブに、以下のボタンから本記事のアドレスつきでツイート/ブクマしていただくと、上にあるzenbackのウィジェットに反映されます。
  このエントリーをはてなブックマークに追加
または同ウィジェット内のFacebookコメントでお願いしますー。

Facebookのシェアは……されても誰だかわからないのですが、シェア自体は嬉しいので、下にボタンを置かせていただきます。よろしくお願いします。