【第105 話】 危険なほど、SEXY なブログへの道 - ご参拝 編 -
★このブログが始まってもぅすぐ一年。
・・・昨年の収穫といえば、ブログでCool なスクリーンセーバーを実現したこと。とはいえ、読者の最大の関心事であるデザイン講座は後半バテ気味?
・・・して、新年のキーワードは「危険なほど、SEXYなブログデザイン」。もはやCool なデザインでは物足りない。「せくすぃなデザイン」が今年一年の目標だ。もちろんLovely Wolf 特製見返り美女軍団のSEXY ショットもご期待ください。- by Lovely Wolf -
★Lovely Wolf 新年第一号にお越しのみなさん!本日はソラマメに迷い込んだキャワいいエリマキトカゲさんのご参拝からよろしくお願いします。 var gblPhotoShufflerDivId = "photodiv"; var gblPhotoShufflerImgId = "photoimg"; var gblImg = new Array('http://img01.slmame.com/usr/lovelywolf/12.jpg','http://img01.slmame.com/usr/lovelywolf/13.jpg','http://img01.slmame.com/usr/lovelywolf/11.jpg'); var gblPauseSeconds = 4.25; var gblFadeSeconds = 4.25; var gblRotations = 100;var gblDeckSize = gblImg.length; var gblOpacity = 100; var gblOnDeck = 0; var gblStartImg; var gblImageRotations = gblDeckSize * (gblRotations+1); window.onload = photoShufflerLaunch; function photoShufflerLaunch(){var theimg = document.getElementById(gblPhotoShufflerImgId); gblStartImg = theimg.src; document.getElementById(gblPhotoShufflerDivId).style.backgroundImage='url(' + gblImg[gblOnDeck] + ')'; setTimeout("photoShufflerFade()",gblPauseSeconds*1000); }; function photoShufflerFade(){var theimg = document.getElementById(gblPhotoShufflerImgId); var fadeDelta = 100 / (30 * gblFadeSeconds); if (gblOpacity < 2*fadeDelta ){gblOpacity = 100; if (gblImageRotations < 1) return; photoShufflerShuffle(); setTimeout("photoShufflerFade()",gblPauseSeconds*1000);}else{gblOpacity -= fadeDelta; setOpacity(theimg,gblOpacity); setTimeout("photoShufflerFade()",5); }; }; function photoShufflerShuffle(){ var thediv = document.getElementById(gblPhotoShufflerDivId); var theimg = document.getElementById(gblPhotoShufflerImgId); theimg.src = gblImg[gblOnDeck]; setOpacity(theimg,100); gblOnDeck = ++gblOnDeck % gblDeckSize; if (--gblImageRotations < 1){ gblImg[gblOnDeck] = gblStartImg; }; thediv.style.backgroundImage='url(' + gblImg[gblOnDeck] + ')'; }; function setOpacity(obj, opacity) {opacity = (opacity == 100)?99.999:opacity; obj.style.filter = "alpha(opacity:"+opacity+")"; obj.style.KHTMLOpacity = opacity/100; obj.style.MozOpacity = opacity/100; obj.style.opacity = opacity/100;}
#photodiv {background-repeat: no-repeat; padding:0px; margin:0px;border: none;}
#photoimg {background-repeat: no-repeat; padding:0px; margin:0px;border: none;}
★して、今年オレが目指しているデザインはこれだっ!
# 「安室奈美恵 (あむろ なみえ)(あむろなみえ) Official Website」より引用
<WEB URL>
http://www.avexnet.or.jp/amuro/index.html
# 「EGOIST公式WEBSITE(ショップリスト、コーディネート、リクルートなどのコンテンツが含まれています。)」より引用
<WEB URL>
http://www.egoist-inc.com/index.html
★では、本日ご参拝のみなさまだけに、このブログのご本尊であるJavaScript Tips を特別公開してさしあげましょう。
★まずは、中央にあるロゴ画像をクリックしてみる。
★普通のブログなら、そのブログのトップページが開いて、左下の赤アミ部分に日付や記事のタイトルが出るはずなんだが・・・。
<WEB URL>
http://lovelywolf.slmame.com/
・・・このブログは、左下の赤アミ部分にMY ALBUM って書いてある。
★スクロールしてみると、たしかにMY ALBUM が出てきた。トップページのスタイルシートをMY ALBUM 風にしたわけでもないのだが、・・・。
★種明かしすると、トップページが一度開いた後すぐにMY ALBUM のページに移動したわけだ。
・・・やり方は簡単。テンプレートの編集画面「カスタマイズ」を開く。
# おことわり
使用中のテンプレートを直接編集してブログの調子がおかしくなっても責任は負えません。ご自分の責任にてバックアップを取ってからお試しください。
★あとは「トップページ」のトコロを編集するだけ。
・・・<body> タグを探し、次のように変更する。
# 書き方
<body onload="location.href= ' 移動先のURL ' ">
・・・シングルクォーテーション(半角 ' )とダブルクォーテーション(半角 " )でくくる部分を間違えないようにする。便宜上、URL 部分に半角空白を入れてるのでそのままコピペしても動きません。実際には半角空白は入りません。
# Tips1. MY ALBUM のURL の作り方
http:// (ブログ名) .slmame.com/album.html