Question

我有這個JavaScript

$(window).load(function(){ 
var $menu = $("header"); 
var opacity = $menu.css("opacity"); 
var scrollStopped; 

var fadeInCallback = function() { 
    if (typeof scrollStopped != 'undefined') { 
     clearInterval(scrollStopped); 
    } 

    scrollStopped = setTimeout(function() { 
     $menu.animate({ opacity: 1 }, "slow"); 
    }, 1400); 
} 

$(window).scroll(function() { 
    if (!$menu.is(":animated") && opacity == 1) { 
     $menu.animate({ opacity: 0 }, "200", fadeInCallback); 
    } else { 
     fadeInCallback.call(this); 
    } 
    }); 
}); 

它躲藏在滾動的標題，但增加了一些高度運行良好：100％;到HTML，正文和一個'內容div'溢出隱藏在HTML和身體和'內容div'自動此JavaScript不再有效。

任何想法爲什麼這個JavaScript不工作？有沒有修復或其他方式來做到這一點，所以滾動時頭部會淡出？

在此先感謝

編輯----

一個的jsfiddle - http://jsfiddle.net/sturobson/AMJFG/

用更少的CSS一個較新的小提琴 - http://jsfiddle.net/sturobson/AMJFG/1/

Answer 1

你的腳本對我的作品。

但是如果你想嘗試另一種方法嘗試下面，根據你的，但有點簡單：

$(document).ready(function(){ 
    headerFade(); 
}); 
function headerFade() { 
    var $menu = $("header"), 
     opacity = $menu.css("opacity"), 
     scrollStopped, 
     methods = { 
      init: function(){    
       $(window).scroll(function() { 
        (!$menu.is(":animated") && opacity == 1) ? $menu.fadeOut(200, methods.fadeInCallback()) : methods.fadeInCallback();     
       });    
      }, 
      fadeInCallback: function(){    
       clearInterval(scrollStopped);        
       scrollStopped = setTimeout(function() { 
        $menu.fadeIn(600); 
       }, 1400); 
      } 
     }; 
    methods.init(); 
};