1

私は練習用のウェブサイトを作成していて、画像にホバー効果を追加しようとしています。画像は、前後にクリックする矢印です。コードの構造内で何か問題があると思います。または、ロールオーバー効果を実現するために JavaScript を使用する必要があるかもしれません。

現在の作業を示すためにフィドルを作成しました: http://jsfiddle.net/Z7VTy/1/

...私はすべてが初めてです。

   <body>
   <div id="slider_wrapper">
    <div id="slider_container">
     <div class="controllers" id="previous"></div>

  <div id="slider">
  <img src="Images/slide_two.png" width="960" height="425" />
  <img src="Images/slide_one.png" width="960" height="425" />
  <img src="Images/slide_three.png" width="960" height="425" />
  </div>                           

  <div class="controllers" id="next"></div>
   </div>         
 </div>
 </body
4

2 に答える 2

0

Slider_wrapper コンテナを div からタグに変更し、slider_wrapper のホバー状態を使用できます。#previous と #next の表示モードを none に変更し、次のスタイルを追加します

#slider_wrapper:hover #previous, #slider_wrapper:hover #next{
    display:block;
}

ここで例を参照してくださいhttp://jsfiddle.net/Z7VTy/3/

于 2013-05-17T07:52:15.143 に答える
0

あなたの問題を理解しているかどうかわからない

デモ

#previous:hover {
background-image: url(left_on.png);
}

イメージ変わるだろう

于 2013-05-17T07:45:25.477 に答える