-1

現在、あるサイトで作業を行っていますが、問題が画像にあるのか html/JS コードにあるのかわからない問題に遭遇しました。

ロールオーバー効果があり、別の画像に変わる7つの画像でナビゲーションメニューを作成しています。

これは最初の画像の私のコードです。

<div id="nav-menu">
 <a href="Culture.html" onmouseover="culture-nav.src='images/nav/over_culture.gif';"onmouseout="culture-nav.src='images/nav/norm_culture.gif';">
  <img border="0" src='images/nav/norm_culture.gif' alt="Culture-nav-button";name="culture_nav"/>
 </a>
</div>

PS で画像を作成したときは、スライスも使用し、Web デバイスと png-24 用に保存しました。ただし、外側の 2 つの画像は png で、内側の 5 つは gif です。これは問題ですか、それとも私のコードですか?どうすれば修正できますか?

参照: over_culture.gif(onmouseover) norm_culture.gif(hover/onmouseout)

4

1 に答える 1

1

これは、次のように css でのみ行うことができます: (画像サイズに応じて幅と高さを変更します)

<style>
#nav-menu a{display:block;}
a.culture {width:100px;height:100px; background: url(/images/nav/norm_culture.gif) no-repeat 0 0 }
a.culture:hover{background: url(/images/nav/over_culture.gif) no-repeat 0 0}
</style>
<div id="nav-menu"> 
 <a href="Culture.html" class="culture">Culture</a> 
</div>
于 2012-07-28T12:43:27.537 に答える