首頁 > 其他

使兩個DIV捲軸同時滾動

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！
問題提出：http://www.cnblogs.com/trueben/archive/2006/07/24/458370.html
見下面的例子：滾動左邊的DIV時，右邊的DIV同步滾動。
原理很簡單，在左邊的DIV的onscroll事件中，設定右邊的DIV的scrollTop與左邊的相同即可。

 
代碼如下：<html>
    <head>
<style>
    DIV {width:200;height:200;border:solid 1px;overflow-x:hidden;overflow-y:scroll;}
    body {margin:0;background-color : transparent;}
    </style>
</head>
<body>
<!--
<div onscroll="ToScroll.scrollTop = this.scrollTop;"> 
-->
<div onscroll="document.getElementById('ToScroll').scrollTop = this.scrollTop;"> 
1. re: 請教：如何在子頁面關閉時把焦點設定到父頁面的伺服器控制項上？ 
評論內容較長,點擊標題查看 
--quitgame 
2. re: 請教高手，如何取得Target屬性 
評論內容較長,點擊標題查看 
--quitgame 
3. re: 請教高手，如何取得Target屬性 
評論內容較長,點擊標題查看 
--trueben 
4. re: 請教高手，如何取得Target屬性 
Request.QueryString["target"]; 
--wudebin 
5. re: [急]請教:如何防止同時訪問相同頁面？ 
評論內容較長,點擊標題查看 
--Pharaoh 
閱讀熱門排行榜
1. 在asp.net中如何防止二重啟動,相當於VB中函數App.PrevInstance的功能(235) 
2. [急]請教:如何防止同時訪問相同頁面？(160) 
3. 請教：如何在子頁面關閉時把焦點設定到父頁面的伺服器控制項上？(155) 
4. 請教高手，如何取得Target屬性(141) 

</div>

<div id="ToScroll" style="left:220px;position:absolute;top:0px;">
1. re: 請教：如何在子頁面關閉時把焦點設定到父頁面的伺服器控制項上？ 
評論內容較長,點擊標題查看 
--quitgame 
2. re: 請教高手，如何取得Target屬性 
評論內容較長,點擊標題查看 
--quitgame 
3. re: 請教高手，如何取得Target屬性 
評論內容較長,點擊標題查看 
--trueben 
4. re: 請教高手，如何取得Target屬性 
Request.QueryString["target"]; 
--wudebin 
5. re: [急]請教:如何防止同時訪問相同頁面？ 
評論內容較長,點擊標題查看 
--Pharaoh 
閱讀熱門排行榜
1. 在asp.net中如何防止二重啟動,相當於VB中函數App.PrevInstance的功能(235) 
2. [急]請教:如何防止同時訪問相同頁面？(160) 
3. 請教：如何在子頁面關閉時把焦點設定到父頁面的伺服器控制項上？(155) 
4. 請教高手，如何取得Target屬性(141) 

</div>
</body>
</html>

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More