【问题标题】:wordpress: sticky menu not sticking upon scroll until laterwordpress:粘性菜单直到稍后才滚动
【发布时间】:2017-09-25 19:11:26
【问题描述】:

我正在使用平面主题 (Cordillera) on my new blog set up 并帮助将主页全屏横幅调整为更小的尺寸 (you can see that post and solution in this thread)。

该解决方案效果很好,但我现在注意到粘性菜单在到达页面顶部时并没有粘住,而是在进一步向下滚动时会跳到板上(在 chrome 上点击跳转到关于我的博客部分)。我假设这个问题与横幅调整大小有关,但老实说,我对此不是 100% 确定。

我不确定要提取什么代码进行检查,这是我第一次使用平面主题,但如果有人告诉我要查找什么,我可以。

再次感谢您的帮助!

【问题讨论】:

    标签: html css wordpress


    【解决方案1】:

    控制置顶标题的代码位于脚本文件cordillera.js 中。 代码在视口的高度应用粘性标题,即变量 winHeight:

    var winHeight=$(window).height();  
    

    如果您将 winHeight 设置为自定义数字,它将在此时启动。这是该脚本的代码:

       //fixed header
       $(window).scroll(function(){
      if( $(".top-banner").length ){
       var winHeight=$(window).height();          
        }
        else{
            var winHeight = 0;
            }
       if( $("body.admin-bar").length){
           if( $(window).width() < 765) {
                   stickyTop = 46;
    
               } else {
                   stickyTop = 32;
               }
         }
         else{
             stickyTop = 0;
             }
             $('.sticky-header').css('top',stickyTop);
                       var scrollTop = $(window).scrollTop(); 
                   if ( scrollTop > winHeight + stickyTop ) { 
                   if( !$(".top-banner").length ){
                       $('header#header').hide();
                   }
                       $('.sticky-header').show();
                       } else {
                           if( !$(".top-banner").length ){
                           $('header#header').show(); 
                           }
                           $('.sticky-header').hide();
                       }   
        });
    

    【讨论】:

    • 好的,我明白你现在在说什么了。所以我的标题图片是 500px 高。如果我想让它在那个时候开始变得粘稠,我应该把那条线改成什么?还是我错过了它的工作原理?非常感谢!
    • 您只需将该行更改为“var winHeight=500;” .调整以适应。
    • 谢谢,亚当!没有你的帮助,我永远也想不通 :)
    猜你喜欢
    • 2018-05-24
    • 2017-03-14
    • 1970-01-01
    • 2021-08-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-11-12
    相关资源
    最近更新 更多