scroll 2 frames together

Is there a way I can force two side-by-side vertical frames to scroll together as one? So that when you move the scrollbar on the left frame, the right frame scrolls with it, and vice versa?
LVL 11
SweatCoderAsked:
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

x
 
COBOLdinosaurConnect With a Mentor Commented:
Oops I mised one line of code.... the scroll :^(

It should be:

Something like this:

<script type="text/javascript">
<!--
var x=0;
var y;
function alignF()
{
if (top.frames['xxxxxx'].alignF
{
if (self.pageYOffset) // all except Explorer
{
      y = top.frames['xxxxxx'].pageYOffset;
}
else if (document.documentElement && document.documentElement.scrollTop)
      // Explorer 6 Strict
{
      y = top.frames['xxxxxx'].document.documentElement.scrollTop;
}
else if (document.body) // all other Explorers
{
      y = top.frames['xxxxxx'].document.body.scrollTop;
}
}
scrollTo(x,y);
setTimeout('alignF()',200);
}
onload=alignF;
//-->
</script>

Cd&

0
 
dynawebCommented:
Yes, you can put those two frames (noscroll) inside one larger frame that allows scrolling.  That will make the two inside to scroll together :)
0
 
venkateshwarrConnect With a Mentor Commented:
you can do that using window.onscroll

<script language="JavaScript">

window.onscroll = scrollOtherFrame;
function scrollOtherFrame()
{
        if (navigator.appName == "Microsoft Internet Explorer")
      {
                              top.frame2.scrollTop =document.body.scrollTop;
            //alert("You've scrolled to " + document.body.scrollTop + " pixels.");
      }
      else{  
                        top.frame2.scrollTop = window.pageYOffset;
                        //alert ("You've scrolled to " + window.pageYOffset + " pixels.");
                }
       
}

</script>

venkat.
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
COBOLdinosaurCommented:
Something like this:

<script type="text/javascript">
<!--
var x=0;
var y;
function alignF()
{
if (top.frames['xxxxxx'].alignF
{
if (self.pageYOffset) // all except Explorer
{
      y = top.frames['xxxxxx'].pageYOffset;
}
else if (document.documentElement && document.documentElement.scrollTop)
      // Explorer 6 Strict
{
      y = top.frames['xxxxxx'].document.documentElement.scrollTop;
}
else if (document.body) // all other Explorers
{
      y = top.frames['xxxxxx'].document.body.scrollTop;
}
}
setTimeout('alignF()',200);
}
onload=alignF;
//-->
</script>

Put it in the head of the pages and replace 'xxxxxxx' with the name of the other frame.

Cd&

0
 
SweatCoderAuthor Commented:
I tried both of your scripts, and neither of them worked. venkateshwarr, your script did nothing in my IE6 browser. cobol, your script was missing some parens and curly braces, so i fixed it up, and then tried various derivatives of your code. In 2 cases I got "not implemented" errors. In one case when I scrolled the left frame, it (left frame) went buggy and danced up and down, but the right frame never moved.

Sorry I didn't clarify--I am only interested in IE 5.5+ compatibility. My frame model is composed of 3 frames: PermsTop, PermsLeft, PermsRight.

When I scroll the left frame down, I need the right frame to scroll exactly with it, pixel-for-pixel. The 2 frames each have a table in which the row count always matches, so the vertical size of each frame is always identical, just FYI. I have to use 2 frames, can't combine into one, long story. Don't include any netscape stuff 'cause I won't need it.

Hope you can help. I've been on MSDN and tried some of the doScroll stuff, which also didn't work.
0
 
SweatCoderAuthor Commented:
this ended up being the perfect solution:

var var_deltaY = 0;
  function doIt(){
      deltaY = document.body.scrollTop
      if(deltaY != var_deltaY){
            top.PermsRight.scrollTo(0,deltaY);
            var_deltaY = deltaY
      }
  }

<BODY onScroll="setInterval('doIt()',1)">

you both got me thinking in the right direction. . .i found the script above online and had to tweak it a bit, but it works great.
0
 
SweatCoderAuthor Commented:
stop the presses, this is even better:

<BODY onScroll="top.PermsRight.scrollTo(0,document.body.scrollTop)">

that's it!!!! no extra javascript function required. that single line of code does EXACTLY what I needed, and elegantly too. this is an IE solution.
0
All Courses

From novice to tech pro — start learning today.