Javascript 覆盖函数内的观察者或check语句?

Javascript 覆盖函数内的观察者或check语句?,javascript,jquery,performance,Javascript,Jquery,Performance,我是JavaScript的新手(使用JQuery),为固定标题创建JQuery的观察者(向下滚动时隐藏,向上滚动时显示)+调整观察者的大小,使其便于移动 我应该使用: var $window = $( window ), minWindowHeight = ( $window.height() >= ( $( 'header' ) * 5 ) ); // Init when page opened if ( minWindowHeight ) { $window.

我是JavaScript的新手(使用JQuery),为固定标题创建JQuery的观察者(向下滚动时隐藏,向上滚动时显示)+调整观察者的大小,使其便于移动

我应该使用:

var
    $window = $( window ),
    minWindowHeight = ( $window.height() >= ( $( 'header' ) * 5 ) );

// Init when page opened
if ( minWindowHeight ) {
    $window.scroll(function(event){
        // Set setInterval 250 to function (avoid too often funtion call)
        //   -> the function
    });
}

// When browser window resized (for example mobile orientation)
$window.resize(function(event){
    minWindowHeight = ( $window.height() >= ( $( 'header' ) * 5 ) );

    if ( minWindowHeight ) {
        $window.scroll(function(event){
            // Set setInterval 250 to function (avoid too often funtion call)
            //   -> the function
        });
    }
});

或者完全是另一种观察家之类的

另外,回答与教程解释完全这样的事情将是伟大的-我不知道什么关键字搜索


提前谢谢

在这种特殊情况下,我建议您声明一个函数,以最小化对同一变量的大型调用

var win = $(window),
header = $("header");

(function($){
  function gapCalc (win,header){
    return ( $(win).height() >= ( $(header).height()*5 ) );
  }
}(jQuery));

$(window).resize(function(){
  if(gapCalc(win,header)){
    //do something
  }
});

$(document).ready(function(){
  if(gapCalc(win,header)){
    //do something
  }
});

首先,你应该考虑使用媒体查询,使你的页面移动友好,如果不可能用CSS完成,那么你应该使用jQuery:)是的,我的站点建立在媒体查询上,但是在这种情况下,只有当窗口高度至少是5倍的时候,我才会做固定的标题。因为占据了大约40%的屏幕,但在纵向上只有大约15%。啊,我忘了写下我正在使用JQuery来固定标题,因为它在向下滚动时隐藏,在向上滚动时显示。但是在
//做点什么
中,我需要包含
滚动
事件,所以您的解决方案仍然让我未知。如果满足
minWindowHeight
语句,我只想使用
scroll
事件。
var win = $(window),
header = $("header");

(function($){
  function gapCalc (win,header){
    return ( $(win).height() >= ( $(header).height()*5 ) );
  }
}(jQuery));

$(window).resize(function(){
  if(gapCalc(win,header)){
    //do something
  }
});

$(document).ready(function(){
  if(gapCalc(win,header)){
    //do something
  }
});