1

jQuery セレクターを使用して取得した一連の要素に、mouseenter と mouseleave のハンドラーをバインドしたいと考えています。関数は、要素の子に対して作用する必要があります。

これが私のコードです：

$(document).ready(function(){
    $(".topnav-link").bind("mouseenter mouseleave", function() {
        $(this).children(".topnav").toggle();
    });
});

およびhtmlの本文で：

<ul id="nav">
    <li>
        <a class="topnav-link" href="some-url">
            <img class="topnav" src="nav-about-us.png" />
            <img class="topnav hidden" src="/images/site/nav-about-us-on.png" />
        </a>
    </li>
    <li>
        <a class="topnav-link" href="some-url'}">
            <img class="topnav" src="nav-products.png" />
            <img class="topnav hidden" src="/images/site/nav-products-on.png" />
        </a>
    </li>
    <li>
        <a class="topnav-link" href="some-url">
            <img class="topnav" src="nav-contact.png" />
            <img class="topnav hidden" src="/images/site/nav-contact-on.png" />
        </a>
    </li>
</ul>

これは実際には Mac/Win/FF/Safari では問題なく動作しますが、IE6 および IE8 では、$(".topnav-link")セレクターによって取得された最初の要素のみが目的の動作を表示します。

私が欠けているものについて助けてくれてありがとう！

4

1 に答える 1

1

目的のロールオーバー効果を実現するには、CSS を使用する必要があります。

詳細については、 CSS テクニック: プリロードなしの高速ロールオーバーをお読みください。

于 2009-10-29T13:13:22.537 に答える