0

ナビゲーションに問題があります。

HTML

<ul id="menu_bar">
    <li><a href="#home" class="hov selected"><img src="img/Home_on.png" alt="Home" />Home</a></li>
    <li><a href="#portfolio" class="hov"><img src="img/Portfolio_off.png" alt="Portfolio" />Portfolio</a></li>
    <li><a href="#about" class="hov"><img src="img/About_off.png" alt="About" />About</a></li>
   <li><a href="#contact" class="hov"><img src="img/Contact_off.png" alt="Contact" />Contact</a></li>
</ul>

JS

$(document).ready(function() {
    $("img.roll").hover(
        function() { this.src = this.src.replace("_off", "_over");},
        function() { this.src = this.src.replace("_over", "_off");}
    );
    $("a.hov").hover(
        function() {
            var img = $(this).find("img")[0];
            img.src = img.src.replace("_off", "_over");},
        function() {
            var img = $(this).find("img")[0];
            img.src = img.src.replace("_over", "_off");}
    );
    $("a.hov").click(
        function() {
            var img = $(this).find("img")[0];
            img.src = img.src.replace("_over", "_on");
            $("a.hov").removeClass("selected");
            $(this).addClass("selected");
        }
    );

});

アンカークラスを変更するクリック関数を作成し、このアンカー内のimg srcを変更します。別のアンカーで使用すると、最後にクリックしたアンカーが通常のクラスと通常のimgsrcにリセットされます。これで、私の関数はすべての「a.hov」からクラスを削除しますが、このすべてのアイテムのimg.srcを「_off」に変更せず、どのように作成するかわかりません。

4

2 に答える 2

1 
$("a.hov").click(
        function() {

            $("a.hov").each( //Change all "_over" to "_off" for all items
             function() {
                 var img = $(this).find("img")[0];
                 img.src = img.src.replace("_over", "_off");
             });

            var img = $(this).find("img")[0];
            img.src = img.src.replace("_over", "_on"); //replace all "_over" (mabe all will work without this line)
            img.src = img.src.replace("_off", "_on"); //replace "_off"

            $("a.hov").removeClass("selected");
            $(this).addClass("selected");
        }
    );
于 2012-06-05T09:45:08.163 に答える
0 
$("a.hov").click(
        function() {
            var img = $('img', this);
            console.log(img)
            img.attr('src', img.attr('src').replace("_off", "_on"));
            $('a.hov').removeClass("selected");
            $(this).addClass("selected");
        }
    );
于 2012-06-05T09:18:59.393 に答える