5

我遇到了一个问题。我创建了一些“标签”功能，如演示中所示：http: //jsfiddle.net/4FLCe/

计划是，当您将鼠标悬停在选项卡上时，其颜色变为颜色 A，当您单击选项卡时，其颜色变为颜色 B。

从演示中可以看出，单击后背景颜色在悬停时停止变化。我想添加!important悬停的背景颜色，结果可以看到：http: //jsfiddle.net/4FLCe/1/

但这并没有按照我的意愿执行，现在将鼠标悬停在从 javascript 设置的背景颜色上。然后我添加!important到javascript中的颜色集。这导致了一些可怕的事情。唯一能理解我想要实现的浏览器是 Opera。

其他浏览器刚刚停止从 js 应用一个。演示：http: //jsfiddle.net/4FLCe/2/

所以问题是：如何实现下一个工作悬停，所选选项卡的背景具有比悬停更高的“优先级”，因此它不会更改为悬停时悬停的背景，并且在 ie、safari、opera、chrome、ff 中的结果相同?

4

1 回答 1

6

您应该使用 aclass而不是通过.css()方法设置它..

所以创建

.selected-tab{
    background-color:#d6d6d6!important;
}

并将您的代码更改为

$(function() {  
    $('.pagecontent').eq(0).show();
    $('.tab').click(function() {  
        $('.pagecontent').hide();
        $('.selected-tab').removeClass('selected-tab');
        $(this).addClass('selected-tab');
        $('.pagecontent').eq($(this).index()).show();
    });  
});

演示在http://jsfiddle.net/gaby/4FLCe/3/

于 2012-12-19T00:28:59.670 回答