如何找到隐藏元素的内容？

Question

我有一个问题,当页面加载时,div元素变得隐藏.Chrome中的开发者工具告诉我"element.style"正在设置"display:none"

在任何地方都没有显示任何内容.我无法在任何相关的javascript文件中找到任何会隐藏元素的内容.

我完全迷失了它隐藏的原因.

我正在使用的jquery插件称为Supersized.

编辑:请随时查看我正在处理的页面:http://www.gingereventsmpls.com/gallery2.html

如果检查html,隐藏的元素位于此层次结尾:body-> div"controls-wrapper" - > div"controls" - > div"tray-button"

"#tray-button"正在显示:没有以某种方式附加到它上面.

Answer 1

如果您想了解问题的根本原因,可以使用以下几行(在supersized3.shutter.js中找到):

        $(vars.tray_button).toggle(function(){
            $(vars.thumb_tray).stop().animate({bottom : 0, avoidTransforms : true}, 300 );
            if ($(vars.tray_arrow).attr('src')) $(vars.tray_arrow).attr("src", vars.image_path + "button-tray-down.png");
            return false;
        }, function() {
            $(vars.thumb_tray).stop().animate({bottom : -$(vars.thumb_tray).height(), avoidTransforms : true}, 300 );
            if ($(vars.tray_arrow).attr('src')) $(vars.tray_arrow).attr("src", vars.image_path + "button-tray-up.png");
            return false;
        });

它试图使用基于事件的切换,但遗憾的是,从JQuery 1.8开始,该版本的切换功能已被弃用,并在1.9中被删除(您使用的是1.9).所以实际发生的是调用此切换功能,它只是切换div是否被隐藏或显示.

您可以选择降级到JQuery 1.8或更低版本,或者重写依赖于旧的基于事件的切换功能的插件部分.

希望这可以帮助!

编辑:我在下面的代码中重写了插件的上述部分以与1.9兼容,如果有效,请告诉我,我还没有测试过:

$(vars.tray_button).on('click',function(){
    var self=$(this)
    self.data('toggle',!self.data('toggle'))
    if(self.data('toggle')) {
        $(vars.thumb_tray).stop().animate({bottom : 0, avoidTransforms : true}, 300 );
        if ($(vars.tray_arrow).attr('src')) $(vars.tray_arrow).attr("src", vars.image_path + "button-tray-down.png");
    } else {
        $(vars.thumb_tray).stop().animate({bottom : -$(vars.thumb_tray).height(), avoidTransforms : true}, 300 );
        if ($(vars.tray_arrow).attr('src')) $(vars.tray_arrow).attr("src", vars.image_path + "button-tray-up.png");
    }
    return false;
});