ナビの上または下に画像を追加

No.H04 ナビの上に時間により切り替わる画像を表示したい

CSSを変更することで、ヘッダとナビの間に画像を挿入します。元のヘッダはそのまま表示されます。またimgchangerプラグインを導入して時間または日付指定により指定した画像を表示します。
この方法はjQueryは使用していません。
◆手順

1. imgchangerプラグインをD++のサイトからダウンロードします。
2. ダウンロードしたプラグインを一部修正します。paddingをゼロに設定します。
   ソースの上の行が修正前、下の行が修正後です。一応修正前のものは、コメントにして残しておきます。
   注意：保存するとき、文字コードはUTF-8で保存してください。
   imgchanger.inc.phpのソース

   /* return "<div style=\"" . $align . "padding:.5em 1.5em .5em 1.5em\"><img src=\"$uri\" alt=\"\" /></div>";*/
      return "<div style=\"" . $align . "padding:0\"><img src=\"$uri\" alt=\"\" /></div>";

3. imgchanger.inc.phpを自分のサイトの　/plugin のフォルダ配下にアップロードします。
4. 横750px縦70pxの画像を3つ作成します。(サイズは適当に変更してください）
   0時から6時まで：head_3.jpg
   6時から12時まで：head_1.jpg
   12時から24時まで：head_2.jpg
5. SWFUで画像を全部アップロードします。
   以下のコードをナビ２に入れます。これで全ページのヘッダに画像が入るようになります。

#beforescript{{
<style type="text/css">
#wrapper{
  position: relative;
}
.headinf {
width: 750px;
height: 70px;　　　<--- 挿入する画像の高さに調整　A=70
position: absolute;
top: 40px;　　　　<--- 使用しているデザインの高さに調整　B=40
left: 0px;
}
#logo_text {
height:110px;　　<--- 高さを調整　A+B=110
}
</style>
}}
#html2(<div class="headinf">)
#imgchanger(Hi,swfu/d/,L,0000,swfu/d/head_3.jpg,0600,swfu/d/head_1.jpg,1200,swfu/d/head_2.jpg)
#html(</div>)

◆解説

• 使用しているデザインのヘッダの高さと作成した画像の高さを調整してください。
  main.cssの #logo_text を探すと 使用しているヘッダのheight がわかります。
• #logo_text のheightを大きくして挿入する画像が入る領域を確保しています。
• imgchangerは画像の数だけ、パラメータを増やしてください。
• imgchangerの使い方は、imgchanger.inc.phpのソース内に書いてありますが、その通りにしても表示されませんでした。この方法では確認済です。