0
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

     function show1() {
            document.getElementById("img1").display = 'block';
     }
     function hide1() {
            document.getElementById("img1").display = 'none';
        }

</script>
</head>
<body>
<a href="http://www.feverpitchholidays.com/corporate-team-outing-lnt/"><span onMouseOver="show1()" onMouseOut="hide1()">Corporate Team Outing - LNT</span></a>

<div id="img1" style="display:none">
    <img src="" alt="image 1" />
    <img src="" alt="image 2" />
</div>
</body>
</html>

マウスをテキストの上に置くと、div im に画像が表示されますが、機能しません。

4

1 に答える 1

0

このためのJavaScriptを忘れてください!CSSが答えです。ID:img1 と div 内の画像にホバー状態を配置します (後者を行わないと、画像の上にマウスを移動すると、div のマウスオーバーがキャンセルされます。したがって、このようになります (マウスオーバーによるインライン スタイルではありません)。状態宣言):

#img1 {
  Background-image: none;
}

#img1:hover, img1:hover img {
  Background-image: url(your URL);
}

ID をクラスに変更して、CSS を再利用し、コーディング (javascript など) のために ID を保持できるようにすることができます。

于 2013-04-02T09:40:03.583 に答える