1

我遇到了一个问题，当页面加载时，div 元素被隐藏。Chrome 中的开发人员工具告诉我“element.style”正在设置“display: none”

它不在我的 css 中任何地方都没有显示。我在任何一个相关的 javascript 文件中都找不到任何会隐藏该元素的内容。

我完全不知道它为什么隐藏。

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

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

如果您检查 html，隐藏的元素位于此层次结构的末尾：body->div"controls-wrapper"->div"controls"->div"tray-button"

“#tray-button”是以某种方式得到 display:none 的东西。

4

2 回答 2

7

如果您想了解问题的根本原因，可以使用以下几行（在 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;
        });

它正在尝试使用基于事件的 toggle，但不幸的是，该版本的 toggle 功能自 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;
});
于 2013-09-16T03:22:12.713 回答
-1

或者像这样通过jquery： 

    $('#tray-button').removeAttr('style');

于 2013-09-16T03:10:09.333 回答