0

ロールオーバー コードをグーグルで検索したところ、次のアドレスで動作するように思われるコードが見つかりました: http://www.dnolan.com/code/js/rollover/。それはおそらく機能しますが、すべてが...へへへ...「ドキュメント内の任意の画像のロールオーバー状態を作成する」方法がわかりません。ノーラン氏が指示を与える方法は、コードをドキュメント ヘッダーにインストールするよりもさらに簡単であることを暗示しているため、説明は必要ありませんが、悲しいことに、私の場合はそうではありません....

8つの円形の画像の行で構成されるナビゲーションバーが、ホバリング時に同じサイズと形状の異なる色の画像に置き換えられるようにする必要があります。

優秀な人で不足している情報を埋めてくれる人はいますか? 対応する例がない部分だけが必要です。タグとヘッダーにその部分があり、画像の名前に適切な変更を加えました。または、あなたが本当の桃になって、すべてのことを一歩一歩教えてくれたら、私は永遠に感謝します.

  <div id="header">
    <div id="home"><a href="feather.html"><img src="images/buttons/home.png" width="89"     height="89" alt="Home"></a></div>
    <div id="security"><a href="security.html"><img src="images/buttons/security_o.png" width="89" height="89" alt="Security"></a></div>
    <div id="phase_1"><a href="phase_1.html"><img src="images/buttons/phase_1.png" width="89" height="89" alt="Phase 1"></a></div>
    <div id="phase_2"><a href="phase_2.html"><img src="images/buttons/phase_2.png" width="89" height="89" alt="Phase 2"></a></div>
    <div id="phase_3"><a href="phase_3.html"><img src="images/buttons/phase_3.png" width="89" height="89" alt="Phase 3"></a></div>
    <div id="basic_package"><a href="basic_package.html"><img src="images/buttons/basic_package.png" width="89" height="89" alt="Basic Package"></a></div>

#header  {
background-image: url(images/complete_header.jpg);
background-repeat: no-repeat;
height: 391px;
width: 900px;
position: relative;
}

#home  {
width: 89px;
height: 89px;
position: absolute;
top: 199px;
left: 91px;
}

他の 7 つのボタンの CSS は、左側の配置を除いてまったく同じです。

4

2 に答える 2

2

リンクをもう少し読んでください。

ドキュメント内の画像については、ロールオーバー状態を作成する必要があります。この画像の唯一の要件は、元の画像とまったく同じ名前が付けられていることですが、名前の最後に_oが必要です。

したがって、画像がある場合は、ロールオーバーで画像を置き換えるfoo.jpg必要があります。foo_o.jpg

もちろん、これはcssとスプライトを使用した方がはるかに優れています。グーグル検索はそのためにたくさんの結果をもたらすはずです。これが私のために思いついた最初の例です。

于 2013-02-07T21:36:10.417 に答える
0

imgoverロールオーバーを使用するすべての画像にクラスを追加するだけでよいと思います。

たとえば<img src="sample.jpg" alt="Some Image">、コードをで置き換えて<img src="sample.jpg" alt="Some Image" class="imgover">、sample_o.jpg画像を作成します

于 2013-02-07T21:35:17.563 に答える