Question

我开发了一个jquery代码，当我向下滚动时应该让菜单隐藏一点，并在我开始向上滚动时重新出现。

我在静态html网站上完成了这项工作，但我很快将其迁移到wordpress，它就停止了工作。我所有的其他js代码都完美无缺..这是代码的一部分：

$(document).ready(function(){

$(window).scroll(function () {
var prevScroll;
var hidden = false;
    var currentScroll = $(this).scrollTop();
    if($("body").scrollTop() > 492){
    if (prevScroll) {
        console.log(currentScroll + "  " + prevScroll);
        console.log(hidden);
        if (currentScroll < prevScroll && hidden) {
            console.log('show');
            $("#header-wrap").animate({marginTop: '0px'}, 200);
            $("#menu").fadeIn("fast");
            hidden=false;

        } else if (currentScroll > prevScroll && !hidden) {
            console.log(hidden);
            console.log('hiding');
            $("#header-wrap").animate({marginTop: '-60px'}, 200);
             $("#menu").fadeOut("fast");
            hidden=true;
        }

    } else if(!hidden){
        console.log('first time');
        $("#header-wrap").animate({marginTop: '-60px'}, 200);
        $("#menu").fadeOut("fast");
        hidden= true;
    }
    prevScroll = currentScroll;
  }
  else{
    if(hidden){
      console.log('show');
      $("#header-wrap").animate({marginTop: '0px'}, 200);
      $("#menu").fadeIn("fast");
      hidden=false;
    }
  }
});
});

我的代码有什么问题？我将它与script.js页面中的所有js代码一起使用。

由于

编辑：我忘了说菜单是隐藏的，这很好，但是一旦我向上滚动它就不会重新出现。因此，部分代码正在运行，另一部分则没有！

Answer 1

jQuery和Wordpress之间可能会发生冲突，因为它们都使用$符号，尝试使用jQuery而不是$或者包装你的jQuery代码内：

jQuery(document).ready(function($){
    $(window).scroll(function () {
        // Your code here
    });
});

Answer 2

试试这个

wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'theme-js', get_template_directory_uri() . '/js/theme.js' );

了解更多详情click here

Answer 3

我做到了，问题是我在函数var prevScroll;开始之后声明var hidden = false;和$(window).scroll(function () {，而不是之前。无论如何，谢谢你的帮助..

在wordpress中无效的jquery代码的一部分

3 个答案: