jQuery条件头类交换

时间:2017-09-01 23:55:08

标签: javascript css wordpress class

希望有人可以帮助我,因为我真的不知道js并想在WP网站上建立现有功能...

我有两个版本的网站标题。在主页上加载alt(透明背景)版本,滚动后,它会切换到全站点非alt(白色bg)版本。

我想添加一个条件,当菜单按钮“切换”(class =“main-navigation toggled”)时,标题也会切换到非alt版本。

这是现有的功能。谢谢你的到来。

jQuery(document).ready(function ($) {
    console.log('ready');
      var header = $(".site-header");
      if( $("body.home").length ) {
        header.addClass("site-header-alt");
      }
        
      $(window).scroll(function() {    
          var scroll = $(window).scrollTop();
          
          if( $("body.home").length ) {
            if (scroll <= 100) {
                header.addClass("site-header-alt");
            } else {
                header.removeClass("site-header-alt");
            }
          }
      });
  });

1 个答案:

答案 0 :(得分:0)

只需简单地说:

$(document).ready(function () {

    // check if .main-navigation contains toggled class
    if ( $(".main-navigation").hasClass("toggled") )
    {
        header.addClass("site-header-alt");
    }

    // Also listen to the click event of the element that does the toggling.
    $(".menu-toggle").click( function () {
        if ( $(".main-navigation").hasClass("toggled") )
        {
            header.addClass("site-header-alt");
        }
    });

    // other stuffs
});

希望有所帮助