faqts : Computers : Programming : Languages : JavaScript

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

21 of 24 people (88%) answered Yes
Recently 9 of 10 people (90%) answered Yes


how to connect scroll bars, so if i scrol 1 barr the other is moving to

Apr 5th, 2008 20:17
ha mo, Dave Clark, jeroen free,

Presuming that you are referring to the use of FRAMEs, the following 
cross-browser code will use the onScroll event, of one FRAME, to 
synchronize, via scrollTo(), the scroll position of the other FRAME 
(the other FRAME doesn't even have to have a scrollbar).  However, 
because NS4 does not support the onScroll event, the setInterval() 
method is used, for NS4 only, to monitor scroll positions without the 
use of a normal event.  The following code would go in the HEAD section 
of the document in one FRAME (presumably, the one with a scrollbar):
<script language="JavaScript"> 
<!-- // Begins 
otherFrame = window.top.frames["otherFrameName"]; 
IE = (document.all) ? true : false; 
last_x = 0; 
last_y = 0; 
function synchronizeScroll() { 
   var x, y; 
   if (IE) { 
      x = document.body.scrollLeft; 
      y = document.body.scrollTop; 
   } else { 
      x = window.pageXOffset; 
      y = window.pageYOffset; 
   if (x != last_x || y != last_y) { 
      last_x = x; 
      last_y = y; 
// Ends --> 
and the following would be coded in the BODY tag of that same document:
<body onScroll="synchronizeScroll()"
 onLoad="if (!IE) window.setInterval('synchronizeScroll()', 100);">
That's all there is to it.  Please note that this code synchronizes 
both vertical scroll *and* horizontal scroll -- at the same time.   ;-)
Take care.
Dave Clark