从页面加载设置活动图像

时间:2013-09-20 17:03:23

标签: javascript jquery

我目前正在使用以下jQuery代码来进行img悬停并单击。问题是,我希望menuleft_off img作为menuleft_on img加载而不会阻止jQuery代码工作。

所以换句话说,我希望在页面上加载menuleft img,就像我已经点击它一样。


我已将“images / menuleft_off.png”更改为“images / menuleft_on.png”。现在当我点击“images / menuright_off.png”更改标签时,“images / menuleft_on.png”保持为_on并且不会改变,直到我将鼠标悬停在它上面。关于如何在点击“images / menuright_off.png”标签/图片时将“images / menuleft_on.png”更改为“images / menuleft_off.png”的任何提示??


HTML:

<div id="toptabs" class="maintabs">
    <ul>
        <li><a href="#" rel="tcontent1" class="selected"><img src="images/menuleft_off.png" width="277" height="42" class="img-swap" /></a></li>
        <li><a href="#" rel="tcontent2"><img src="images/menuright_off.png" width="277" height="42" class="img-swap" /></a></li>
    </ul>
</div>

的jQuery

jQuery(function(){
    $(".img-swap:not(.active)").hover(
    function(){this.src = this.src.replace("_off","_on");},
    function(){
        if(!$(this).hasClass('active')){
            this.src = this.src.replace("_on","_off");
        }
    });
    $(".img-swap").click(function(){
        $(".img-swap.active").each(function(){
            this.src = this.src.replace("_on","_off");
            $(this).removeClass('active');
        });
    $(this).toggleClass('active');
    });
});

0 个答案:

没有答案