jquery fadeToggle和removeAttr功能

时间:2012-06-23 06:00:01

标签: jquery

工作网址:http://runnerupapparel.com/building/

单击“信息”或“查看”链接后,一切正常,但单击x关闭面板时,链接颜色不会回到灰色,#666。当fadeToggle被激活时,其他导航链接也不可用将是美丽的。不完全确定如何接近那个。提前谢谢。

$(document).ready(function() {

    $("#info").hide();
    $(".info").show();

    $('.info').click(function() {
        $("#info").fadeToggle();
        $(".info a").css({
            'color': '#d71635',
            'background': 'url(/building/images/bolt.png) left -23px no-repeat',
            'position': 'relative',
            'z-index': '9998'
        });
        $(".info").css({
            'background': 'url(/building/images/bolt.png) right -23px no-repeat',
            'position': 'relative',
            'z-index': '9999'
        });
    });

    $('.closeinfo').click(function() {
        $(".info a").removeAttr('style');
        $(".info").removeAttr('style');
        $("#info").fadeToggle();
    });

    $("#look").hide();
    $(".look").show();

    $('.look').click(function() {
        $("#look").fadeToggle();
        $(".look a").css({
            'color': '#d71635',
            'background': 'url(/building/images/bolt.png) left -23px no-repeat',
            'position': 'relative',
            'z-index': '9998'
        });
    });

    $('.closelook').click(function() {
        $(".look a").removeAttr('style');
        $("#look").fadeToggle();
    });

});​

1 个答案:

答案 0 :(得分:0)

所以我可以告诉他我会做什么:

在.css文件中(或者您管理默认样式)为每个链接创建两个不同的类。一旦你做完了。然后,您可以使用.toggleClass(“newClass”)方法来回切换。当你单击两次链接时,这应该摆脱不会变回灰色的颜色。然后,当您单击x按钮时,您可以将所有链接的类更改为使其变灰的类:$('.selector').attr('class','newClass')

响应当您显示信息或外观面板时无法点击其他链接的问题是由高度问题引起的。我访问了您提供的网站并进入了“检查员”模式并使用了您的css属性。当我取消选中为454px设置的height属性时,问题就消失了。所以只需设置一个比你现在设定的小得多的高度,这应该可行。