スポンサーサイト 
-- -- --
-- --:--:--

スポンサー広告  Comment -  Trackback -  edit.

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

ブログに雪を降らせる 
2005 12 08
Thu 18:38:04

カスタマイズ  Comment 0  Trackback 0  edit.

多分、ここのトップページを見れば分かると思いますが、今日はちょっとカスタマイズネタ。「ブログに雪を降らせる」と言ってもトップページが有るテンプレートじゃないと意味無いですが(笑)
今自分が使っているスクリプト、実は「星を降らせる」スクリプトを只単に白い●に変更しただけです。
外部ファイルにしているので使う方はスクリプトをダウンロードして使ってみて下さい。
yuki.js
では改造方を。

<!--index_area-->
<script src="http://blog-imgs-1.fc2.com/b/r/e/breaktime/yuki.js" type="text/javascript" charset="euc-jp"></script>
<!--/index_area-->


まずはスクリプトの呼び出しですが、ここではトップページのみ呼び出す事にしています。(他のスクリプトとの衝突を考えて)
次に

<!--index_area-->
<body id="index_body" onLoad="star()">
<!--/index_area-->
<!--not_index_area-->
<body>
<!--/not_index_area-->


これは、通常記事のページでonLoad="star()"を使うとスクリプトエラーが出るためトップページのみonLoad="star()"を呼び出している部分です。
この辺は、壁紙チェンジャーの時にスクリプトを使用しないページでonLoadを使うとエラーに成るのを回避させる意味で<!--index_area-->と<!--not_index_area-->を使い分けると出来ます。
(indexシリーズを使っている方は<body>にonLoad="star()"を追加して下さい。
 その場合も、<!--index_area-->に入っている<body>タグに追加します。<!--index_area-->に<body>タグが無い場合は<!--index_area--><body id="index_body" onLoad="star()">を追加します。<!--not_index_area-->にも無い場合も<body>タグを追加。)

<div id="dot1" style="POSITION: absolute;display:none; TOP: 1px; LEFT: 1px;">●</div>
<div id="dot2" style="POSITION: absolute;display:none; TOP: 5px; LEFT: 1px;">●</div>
<div id="dot3" style="POSITION: absolute;display:none; TOP: 15px; LEFT: 1px;">●</div>
<div id="dot4" style="POSITION: absolute;display:none; TOP: 60px; LEFT: 1px;">●</div>
<div id="dot5" style="POSITION: absolute;display:none; TOP: 35px; LEFT: 1px;">●</div>
<div id="dot6" style="POSITION: absolute;display:none; TOP: 90px; LEFT: 1px;">●</div>
<div id="dot7" style="POSITION: absolute;display:none; TOP: 20px; LEFT: 1px;">●</div>
<div id="dot8" style="POSITION: absolute;display:none; TOP: 40px; LEFT: 1px;">●</div>
<div id="dot9" style="POSITION: absolute;display:none; TOP: 10px; LEFT: 1px;">●</div>


上のタグが「雪」に成る部分ですが、本来は画像などを使用する様に設定されていました。
しかし画像だと作るのに面倒なので白い●を使用しています。
桜を降らしたり星を降らせる場合は、何種類か画像を用意して入れ替えて下さい。
上のタグの貼り場所ですが、トップページの設定がされている箇所、<div id="index_menu_bg_top">などが良いでしょう。
まぁ?absolute属性を使っているのでどこに有ってもブラウザの左上からの配置に成ります。
但し<!--not_index_area-->の中に貼り付けたら記事に雪が降ります。(お好みで(笑))
後はスクリプト本体の横幅と縦を設定すれば良いだけです。
width = 800, height = 400;と三カ所設定すれば降らせる範囲を設定出来ます。
この場合も、ブラウザの左上からの数値なので、中央にしているテンプレートなどでは多少広い範囲を設定して下さい。
スクリプトの詳しい説明は省きます。(知らないし(爆))
まぁ?ネットではこういったフリーのスクリプトが色々有りますので検索で探して使ってみるとオリジナルなワンポイントとして使えますね。

ジャンル [ ブログ テーマ [ カスタマイズ ]

Re comments.

Comment form.

  管理者にだけ表示を許可する 
  注意 名前、タイトル、本文を入力する事で投稿可能になります。

Trackbacks.

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