讓頁面上兩個div中的滾動條(滑塊)同步運動示例
更新時間：2013年08月07日 16:59:17 作者：
如何想讓頁面上兩個div中的滾動條(滑塊)同步運動該怎實現(xiàn)，具體代碼如下，感興趣的朋友可以參考下
使用JQuery添加如下代碼
$('#sourceDiv').scroll( function() {
$('#targetDiv').scrollTop($(this).scrollTop());
$('#targetDiv').scrollLeft($(this).scrollLeft());
});
$('#targetDiv').scroll( function() {
$('#sourceDiv').scrollTop($(this).scrollTop());
$('#sourceDiv').scrollLeft($(this).scrollLeft());
});
效果圖：
復(fù)制代碼 代碼如下:
$('#sourceDiv').scroll( function() {
$('#targetDiv').scrollTop($(this).scrollTop());
$('#targetDiv').scrollLeft($(this).scrollLeft());
});
$('#targetDiv').scroll( function() {
$('#sourceDiv').scrollTop($(this).scrollTop());
$('#sourceDiv').scrollLeft($(this).scrollLeft());
});
效果圖：
相關(guān)文章
基于jQuery.i18n實現(xiàn)web前端的國際化
這篇文章主要介紹了基于jQuery.i18n實現(xiàn)web前端的國際化，具有很好的參考價值，希望對大家有所幫助2018-05-05
這篇文章主要介紹了jQuery中ready事件用法,實例分析了ready事件的功能、定義及文檔加載就緒以后觸發(fā)的具體使用技巧,需要的朋友可以參考下2015-01-01
jQuery綁定點擊事件與改變事件的方式總結(jié)及多個元素綁定多個事件
我們一說到j(luò)Query中對于元素的修改,就是元素的內(nèi)容、屬性、樣式的修改,下面這篇文章主要給大家介紹了關(guān)于jQuery綁定點擊事件與改變事件的方式總結(jié)及多個元素綁定多個事件的相關(guān)資料,需要的朋友可以參考下2022-12-12
jQuery is not defined 錯誤原因與解決方法小結(jié)
今天在測試一個程序的時候，明顯已經(jīng)加載了jquery但總是提示jQuery is not defined，經(jīng)過多方測試終于發(fā)現(xiàn)了問題，這里簡單總結(jié)一下,需要的朋友可以參考下2017-03-03
這篇文章主要介紹了jQuery獲取動態(tài)添加元素的方法詳解,jQuery 是一個高效、精簡并且功能豐富的 JavaScript 工具庫,它提供的 API 易于使用且兼容眾多瀏覽器，這讓諸如 HTML 文檔遍歷和操作、事件處理、動畫和 Ajax 操作更加簡單,需要的朋友可以參考下2023-08-08
圖片的展開和收縮使用jquery實現(xiàn)不可思議吧，感興趣的朋友可以參考下哈，希望對你學(xué)習jquery 有所幫助2013-04-04
本教程將為大家詳細介紹下使用公用方法驗證jquery struts唯一標識，感興趣的朋友可以參考下哈，希望可以幫助到你2013-03-03
由于ASP.NET網(wǎng)頁運行后，服務(wù)器控件會隨機生成客戶端id，jquery獲取時候不太好操作，google了下，總結(jié)有以下3種方法.2010-05-05
本文給大家簡單談?wù)刯Query中的獲取高度和寬度的height和width方法，這里總結(jié)一下，方便大家更好的理解，有需要的小伙伴可以參考下。2015-07-07
這篇文章主要介紹了jQuery實現(xiàn)的Div窗口震動效果,可實現(xiàn)點擊提交后窗口出現(xiàn)震動效果,需要的朋友可以參考下2015-08-08