//第一種寫法
var a;
function scroll( fn ) {
var beforeScrollTop = document.body.scrollTop,
fn = fn || function() {};
window.addEventListener("scroll", function() {
var afterScrollTop = document.body.scrollTop,
delta = afterScrollTop - beforeScrollTop;
if( delta === 0 ) return false;
fn( delta > 0 ? "down" : "up" );
beforeScrollTop = afterScrollTop;
}, false);
}
scroll(function(direction) {
// console.log(direction);
a = direction;
});
// 第二種寫法
var a;
function scroll( fn ) {
var beforeScrollTop = document.body.scrollTop,
fn = fn || function() {};
window.addEventListener("scroll", function() {
var afterScrollTop = document.body.scrollTop,
delta = afterScrollTop - beforeScrollTop;
if( delta === 0 ) return false;
a = fn( delta > 0 ? "down" : "up" );
beforeScrollTop = afterScrollTop;
}, false);
}
scroll(function(direction) {
// console.log(direction);
return direction;
});
// 第三種寫法------這樣寫不知道fn這個函數的用意,那樣寫很明白就清楚fn的意思了,是執行完事件後的回調函數
var a;
var beforeScrollTop = document.body.scrollTop,
fn = fn || function() {};
window.addEventListener("scroll", function() {
var afterScrollTop = document.body.scrollTop,
delta = afterScrollTop - beforeScrollTop;
if( delta === 0 ) return false;
fn( delta > 0 ? "down" : "up" );
beforeScrollTop = afterScrollTop;
}, false);
function fn(direction) {
// console.log(direction);
a = direction;
};
window.onscroll=function(){
console.log(a);
}
今天在作相似於京東、天貓樓層切換效果的時候,利用循環實現,須要執行一個iscroll的方法,但是這個方法卻只能在知足條件的時候執行一次,而不是每次滾動都可以實現,因此就想到要判斷滾動條滾動方向,因此就搜了這麼一段代碼,由於涉及到js閉包的知識,本人就掛了,對閉包真的是不懂,多虧問了文傑同窗,理解了這麼一段代碼,寫下來,記錄一下。閉包
(雖然最終這個效果並不須要判斷滾動條滾動方向,是本身的邏輯發生了錯誤)。函數