Question

当页面向下滚动时，我正在使用此功能在屏幕上保留div。这工作正常，但它似乎打破了一些其他jQuery代码（在wordpress中）。问题在于以下功能。如果我删除它，其他代码工作正常。有人可以通过以下代码建议可能存在的问题：

jQuery(document).ready(function($){ 
    jQuery.event.add(window, "scroll", showbar);
    var sharebar = jQuery('#showbar');
    var start = jQuery(sharebar).offset().top;
        function showbar() {
            var p = jQuery(window).scrollTop();
            jQuery(sharebar).css('position',((p+10)>start) ? 'fixed' : 'absolute');
            jQuery(sharebar).css('top',((p+10)>start) ? '10px' : '');
        }   
});

编辑：我打破'代码'的意思是，如果我在我的wordpress主题中包含一个具有此代码的javascript。 wordpress的javascript将无法在主题的控制面板中工作（例如，通过单击图像上传按钮等没有灯箱弹出窗口）。我删除此代码后，wordpress控件将立即开始工作。显然，这段代码有问题。

编辑2：

我似乎没有得到任何js错误，但我注意到如果我将代码包装在(function() { .. })();而不是jQuery(document).ready(function($){，那么wordpress没有任何问题，但后来我的代码不起作用。你能建议我如何使用function（）而不是jQuery（document）.ready ..抱歉，我对jquery没有太多的了解。

Answer 1

删除那段代码，并添加以下CSS规则：

#showbar {
    position: fixed;
}

这是将元素保持在相同位置的通用方法，即使用户滚动也是如此。 CSS方法比JavaScript实现需要更少的计算能力。

如果您仍想使用JQuery，请查看此页面：http://wpapi.com/wordpress-and-jquery-conflicts-how-to-solve-that/

Answer 2

您创建scroll事件的方式非常不标准。而不是：

jQuery.event.add(window, "scroll", showbar);

你为什么不试试：

jQuery(window).bind('scroll', showbar);

有可能解决您的问题。

Answer 3

为了响应您的第二次修改，请尝试将(function() { ... })()关闭放在文件的最底部，就在结束</body>标记的上方。这样，所有相关的DOM元素都将存在。

jQuery代码打破其他代码

3 个答案: