By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,341 Members | 1,720 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,341 IT Pros & Developers. It's quick & easy.

Scrolling textareas in sync with Firefox

P: n/a
How do I scroll two textareas in sync with FireFox/Mozilla? The IE
solution has been posted before by Martin Honnen.

Jul 23 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a

Mark wrote:
How do I scroll two textareas in sync with FireFox/Mozilla? The IE
solution has been posted before by Martin Honnen.


No one has answered and a bit more searching seems to say that a bug
prevents the textarea onscroll event from firing in past or current
versions of Mozilla or Firefox.

The following code/hack seems to work in Firefox 1.01 on Win2k. It
aligns a appropriately sized DIV with scrollbars so it completely
covers the scrollbars of the lower textarea. This DIV's scrollbar is
used to synchronously scroll both upper and lower textareas.

Has anyone got some other/better work arounds?

<html>
<head>
<script>
</script>
</head>
<body>
<textarea id="ta1" rows=5 cols=80>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20</textarea>
<textarea id="ta2" rows=5 cols=80>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20</textarea>
<div onscroll="if (document.getElementById) {
document.getElementById('ta1').scrollTop = this.scrollTop;
document.getElementById('ta2').scrollTop = this.scrollTop;
}"
style="position: absolute; top: 113; left:654; height: 96px; width:
16px; overflow: auto;">
<br><br><br><br><br><br><br><br><br><br><br><br><b r><br><br><br><br><br>
</div>
</body>
</html>

Jul 23 '05 #2

P: n/a
rh
Mark wrote:
Mark wrote:
How do I scroll two textareas in sync with FireFox/Mozilla? The IE
solution has been posted before by Martin Honnen.


No one has answered and a bit more searching seems to say that a bug
prevents the textarea onscroll event from firing in past or current
versions of Mozilla or Firefox.

The following code/hack seems to work in Firefox 1.01 on Win2k. It
aligns a appropriately sized DIV with scrollbars so it completely
covers the scrollbars of the lower textarea. This DIV's scrollbar is
used to synchronously scroll both upper and lower textareas.

Has anyone got some other/better work arounds?


It's not at all clear why you would want to do this, but presumably
this would only make sense if the content of the textareas is
equivalenced and synchronized as well.

An alternative, for FF and Netscape, would be to sync on
mouseup/mousemove (and keyup) events in the textarea elements, as it
seems mouse events are delivered when mouse activation is initiated
within the scroll bar areas.

This won't work for Mozilla, as it doesn't appear to deliver updated
scrollTop/Left values for the textareas.

../rh

Jul 23 '05 #3

P: n/a


Mark <ms******@aol.com> wrote in message
news:11**********************@g14g2000cwa.googlegr oups.com...
How do I scroll two textareas in sync with FireFox/Mozilla? The IE
solution has been posted before by Martin Honnen.


If this type of event isn't available, you can use simulate it using
periodic monitoring. The following example demonstrates the principle and
works in I.E. and Mozilla but not Opera. Under I.E. it works more smoothly
if the function is called also by the onscroll event:

<textarea id='ta1'onscroll="scrollTa()) ...... >

and you can experiment with shorter timeout the delays.

You don't say whether you want master/slave or dual master scrolling,
however if you want master/slave, remove the redundant code.

<script type='text/javascript'>

var ref1=document.getElementById('ta1'),
ref2=document.getElementById('ta2');
var vPos1=ref1.scrollTop,vPos2=ref2.scrollTop;

function scrollTa()
{
if(ref1.scrollTop!=vPos1)
vPos1=ref2.scrollTop=ref1.scrollTop;
else
if(ref2.scrollTop!=vPos2)
vPos2=ref1.scrollTop=ref2.scrollTop;

setTimeout('scrollTa()',250)
}

window.onload=scrollTa;

</script>
--
S.C. http://makeashorterlink.com/?H3E82245A

Jul 23 '05 #4

P: n/a

rh wrote:
It's not at all clear why you would want to do this, but presumably
this would only make sense if the content of the textareas is
equivalenced and synchronized as well.
Yes that's exactly it. Data values are transform into others and it is
very convenient to sync data pairs.
An alternative, for FF and Netscape, would be to sync on
mouseup/mousemove (and keyup) events in the textarea elements, as it
seems mouse events are delivered when mouse activation is initiated
within the scroll bar areas.

This won't work for Mozilla, as it doesn't appear to deliver updated
scrollTop/Left values for the textareas.

../rh


I haven't tried my posted solution in Mozilla but any solution should
work their as well.

Thanks for your suggestions.

Mark.

Jul 23 '05 #5

P: n/a
Thanks, I'll check this one out as well.

Cheers. Mark.

Jul 23 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.