Question

我已经创建了代码，可以在滚动时将固定类.menu-bar添加到我的菜单中。我的网站是在Wordpress上，我只需要在我的主页上修复菜单。我已经尝试了一些方法，我发现只在主页上使用此代码，但我是初学者，这些并没有按照我想要的方式工作。你能帮我解决这个问题吗？

我的代码：

$(window).scroll(function(){
var menu = $('.menu'),
  scroll = $(window).scrollTop();

  if (scroll >= 100) menu.addClass('menu-bar');
  else menu.removeClass('menu-bar');
});

谢谢！

Answer 1

在您当前活动主题的functions.php中添加代码

如果您希望将此scipt放在主页上，请使用以下代码

add_action('wp_head','includeMyScript');
function includeMyScript()
{
    if(is_front_page() && is_home())
    {
       echo '<script type="text/javscript>
        $(window).scroll(function(){
            var menu = $(".menu"),
            scroll = $(window).scrollTop();

            if (scroll >= 100) menu.addClass("menu-bar");
            else menu.removeClass("menu-bar");
            });
        </script>';
    }

}

如果您希望在主页上关闭主体标签之前将此scipt放在页脚中，请使用以下代码

add_action('wp_footer','includeMyScript');
function includeMyScript()
{

   if(is_front_page() && is_home())
    {
       echo '<script type="text/javscript>
        $(window).scroll(function(){
            var menu = $(".menu"),
            scroll = $(window).scrollTop();

            if (scroll >= 100) menu.addClass("menu-bar");
            else menu.removeClass("menu-bar");
            });
        </script>';
    }
}

Answer 2

使用您的javascript代码创建一个JS文件（my-script.js）。把它放在主题的根目录中。

接下来，在主题的function.php

末尾添加以下几行

function my_scripts() {
    if ( is_front_page() || is_home() ) {
        wp_enqueue_script( 'home-page-script', get_template_directory_uri() . '/my-script.js', array( 'jquery' ), false, false);
    }
}

add_action( 'wp_enqueue_scripts', 'my_scripts' );

wp_enqueue_script注入js文件。阅读以下文档： wp_enqueue_script

仅在Wordpress主页

2 个答案: