jquery scroll()區(qū)分橫向縱向滾動條的方法
jquery在scroll()事件里面，我想判斷當前滾動條橫向還縱向；
我開始用全局變量記錄scrollTop的值來判斷的，如果前后值沒有變就是橫向滾動了，
但是頁面里有多個滾動條，就要多個全局變量來控制，該怎么判斷呢？
scroll jquery 區(qū)分橫向縱向滾動條
解決方法：
each一次設置選擇器選中對象的scrollLeft/scrollTop就行了，然后綁定scroll事件，觸發(fā)的時候獲取scrollLeft/scrollTop和初始化的scrollLeft/scrollTop對比判斷是橫向還是縱向，同時更新對象存儲的scrollLeft/scrollTop
<style>
.c{height:120px;width:120px;overflow:auto;border:solid 1px black;margin-bottom:5px;}
</style>
<div class="c">111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111</div>
<div class="c">111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111</div>
<div class="c">111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111</div>
<div class="c">111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111<br>1111111111111111111</div>
<script src="/js/jquery.js"></script>
<script>
$('div').each(function(){$(this).data('slt',{sl:this.scrollLeft,st:this.scrollTop});}).scroll(function(){
var sl=this.scrollLeft,st=this.scrollTop,d=$(this).data('slt');
if(sl!=d.sl)alert('橫向滾動');
if(st!=d.st)alert('縱向滾動');
$(this).data('slt',{sl:sl,st:st});///
})
</script>
- jQuery scroll事件實現監(jiān)控滾動條分頁示例
- ScrollView滾動條顏色的設置方法
- jquery滾動條插件jScrollPane的使用介紹
- android開發(fā)教程之文本框加滾動條scrollview
- zepto.js中tap事件阻止冒泡的實現方法
- 基于zepto.js實現仿手機QQ空間的大圖查看組件ImageView.js詳解
- 基于zepto.js簡單實現上傳圖片
- jQuery插件zepto.js簡單實現tab切換
- 基于touch.js手勢庫+zepto.js插件開發(fā)圖片查看器（滑動、縮放、雙擊縮放）
- scroll事件實現監(jiān)控滾動條并分頁顯示(zepto.js)
相關文章
Jquery中getJSON在asp.net中的使用說明，需要的朋友可以參考下。2011-03-03
使用 jQuery 將使 Ajax 變得及其簡單。jQuery 提供有一些函數，可以使簡單的工作變得更加簡單，復雜的工作變得不再復雜。2010-04-04
這篇文章主要為大家詳細介紹了layui彈出層效果的實現代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-05-05
這篇文章主要介紹了jQuery實現簡易商城系統(tǒng)項目實操，文章圍繞主題展開詳細的內容介紹，具有一定的參考價值，感興趣的小伙伴可以參考一下2022-06-06
這篇文章主要介紹了超級簡單的jquery操作表格方法,可實現針對表格行與列的增加及刪除操作,是非常實用的技巧,需要的朋友可以參考下2014-12-12
align:左右對齊;vlign:垂直對齊;xleft:水平補給值;xleft:垂直補給值;adjust:是否相對窗口自動調整;rwindow:定位相對于窗口(align&vlign為center時垂直或水平居中)2010-10-10
一個ajax智能提示/補全插件，以前自己用的，現在干脆把它做成插件，需要的朋友可以參考下。2011-02-02
jquery對標簽添加只讀（readonly）或者禁用（disabled）屬性
這篇文章主要介紹了jquery對標簽添加只讀（readonly）或者禁用（disabled）屬性，jQuery是一個JavaScript庫。極大地簡化了JavaScript編程，下面關于其詳細介紹，需要的小伙伴可以參考一下2022-03-03
這篇文章主要介紹了jQuery ztree實現動態(tài)樹形多選菜單，ztree動態(tài)樹形菜單，初始化加載和延遲加載，感興趣的小伙伴們可以參考一下2016-08-08
這篇文章主要為大家詳細介紹了jQuery實現滾動效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-11-11