Question

我有这个脚本隐藏主页上某个点的导航：

jQuery(document).ready(function() {
    jQuery("#dot-nav").show(); //show div initially
    var topOfOthDiv = jQuery("#hidedn").offset().top;
    jQuery(window).scroll(function() {
        if(jQuery(window).scrollTop() > topOfOthDiv) { //scrolled past the other div?
            jQuery("#dot-nav").hide(100); //reached the desired point -- hide div
        }
        if(jQuery(window).scrollTop() < topOfOthDiv) { //hide div
            jQuery("#dot-nav").show(100);
        }
    });
});

然而，它导致woocommerce产品图像无法加载。我不需要woocommerce页面上的脚本，所以在我试图弄乱functions.php之前只在主页上排队它是否有人知道如何解决这个问题？我只是一个jQuery新手，所以如果你需要更多的上下文等我会道歉！

Answer 1

引发错误，因为您无法获得隐藏元素或不存在的元素的偏移量。

jQuery不支持获取隐藏的偏移坐标元素或计算边界，边距或填充身体元素。

您需要做的是检查元素是否存在：

jQuery(document).ready(function() {
    var dotNav = jQuery("#dot-nav");
    var theDiv = jQuery("#hidedn:visible");
    if( dotNav.length>0 && theDiv.length>0 ) {
        dotNav.show(); //show div initially
        jQuery(window).scroll(function() {
            var topOfOthDiv = theDiv.offset().top;
            if(jQuery(window).scrollTop() > topOfOthDiv) { //scrolled past the other div?
                dotNav.hide(100); //reached the desired point -- hide div
            }
            if(jQuery(window).scrollTop() < topOfOthDiv) {
                dotNav.show(100);
            }
        });
    };
});

请注意：您需要检查窗口滚动事件>内的偏移。

jQuery冲突导致woocommerce产品图像无法加载

1 个答案: