JS簡(jiǎn)單判斷滾動(dòng)條的滾動(dòng)方向?qū)崿F(xiàn)方法

更新時(shí)間：2017年04月28日 12:01:39 作者：一步小僧

這篇文章主要介紹了JS簡(jiǎn)單判斷滾動(dòng)條的滾動(dòng)方向?qū)崿F(xiàn)方法,涉及javascript針對(duì)scrollTop事件的相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了JS簡(jiǎn)單判斷滾動(dòng)條的滾動(dòng)方向?qū)崿F(xiàn)方法。分享給大家供大家參考，具體如下：

以下代碼實(shí)現(xiàn)判斷頁(yè)面的滾動(dòng)條的滾動(dòng)方向；

var sign = 80;//定義默認(rèn)的向上滾與向下滾的邊界
window.onscroll = window.onresize = function(){
    var oScrollTop=$(window).scrollTop();
    if ( oScrollTop > 80) {
　　　　　　　　//write your code
    }
    if ( oScrollTop < 80) {
　　　　　　//write your code
　　　　}
    if ( oScrollTop > sign) {
      sign = oScrollTop;//更新scrollTop
      //console.log('向下');
    }
    if ( oScrollTop< sign) {
      sign = oScrollTop//更新scrollTop
      //console.log('向上');
    }
}

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

淺談微信小程序flex布局基礎(chǔ)
這篇文章主要介紹了淺談微信小程序flex布局基礎(chǔ)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-09-09
模擬一個(gè)類似百度google的模糊搜索下拉列表
這篇文章主要介紹使用js模擬一個(gè)類似百度google的模糊搜索下拉列表,需要的朋友可以參考下
2014-04-04
layui問(wèn)題之模擬table表格中的選中按鈕選中事件的方法
今天小編就為大家分享一篇layui問(wèn)題之模擬table表格中的選中按鈕選中事件的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2019-09-09
深入理解JS中attribute和property的區(qū)別
property 和 attribute非常容易混淆，但實(shí)際上，二者是不同的東西，屬于不同的范疇，本文就詳細(xì)的介紹一下JS中attribute和property的區(qū)別，感興趣的可以了解一下
2022-02-02
JS 數(shù)組基本用法入門示例解析
這篇文章主要介紹了JS 數(shù)組基本用法,結(jié)合實(shí)例形式分析了JavaScript數(shù)組的定義、初始化、賦值、打印等相關(guān)操作技巧,需要的朋友可以參考下
2020-01-01
nodejs入門詳解(多篇文章結(jié)合)
Node.js是一套用來(lái)編寫高性能網(wǎng)絡(luò)服務(wù)器的JavaScript工具包，一系列的變化由此開始。比較獨(dú)特的是，Node.js會(huì)假設(shè)你是在POSIX環(huán)境下運(yùn)行它Linux 或 Mac OS X
2012-03-03
JS中的算法與數(shù)據(jù)結(jié)構(gòu)之集合(Set)實(shí)例詳解
這篇文章主要介紹了JS中的算法與數(shù)據(jù)結(jié)構(gòu)之集合(Set),結(jié)合實(shí)例形式詳細(xì)分析了javascript中集合的概念、原理、定義及相關(guān)操作技巧,需要的朋友可以參考下
2019-08-08
javascript使用正則表達(dá)式實(shí)現(xiàn)去掉空格之后的字符
這篇文章主要介紹了javascript使用正則表達(dá)式實(shí)現(xiàn)去掉空格之后的字符的方法,需要的朋友可以參考下
2015-02-02
微信小程序之多列表的顯示和隱藏功能【附源碼】
今天在項(xiàng)目碰到一個(gè)問(wèn)題，之前在項(xiàng)目首頁(yè)實(shí)現(xiàn)單列表的顯示和隱藏，通過(guò)wx:if判斷就可實(shí)現(xiàn)，現(xiàn)在要實(shí)現(xiàn)多列表的單項(xiàng)顯示和隱藏功能應(yīng)該如何實(shí)現(xiàn)呢？下面小編給大家?guī)?lái)了微信小程序之多列表的顯示和隱藏功能，感興趣的朋友一起看看吧
2018-08-08
JavaScript 中調(diào)用 Kotlin 方法實(shí)例詳解
這篇文章主要介紹了JavaScript 中調(diào)用 Kotlin 方法實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下
2017-06-06