Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

scrolling two IFrames using javascript in sync !

Status
Not open for further replies.
fixthebug2003

fixthebug2003

Programmer
Oct 20, 2003
294
US
Hi,
I have two IFRAMES, one at top and one at bottom, both have columnar HTML information. When the scrollbar in the bottom IFRAME is scrolled horizontally by the user, I need to programatically scroll the upperframe also by the same amount, making sure that the frame scrolled amounts are in sync.

Can some one help me?

Fixthebug2003
 
Sort by date Sort by votes
Try this in first IFRAME:
Code: 
<body onscroll="parent.OtherIFrame.scrollTo(document.body.scrollLeft,document.body.scrollTop)">

Adam
while(ignorance){perpetuate(violence,fear,hatred);life=life-1};
 
Upvote 0 Downvote
I got one more question regarding the same IFrames.

The information that I need to display in the IFrame is in the form of a Grid with the number of columns that is very huge. Like,I have to display 25-30 columns, with each column having a width of atleast 100 pixels. Now that mean the data is spanning horizontally for may be 2500 to 3000 pixel. Is that possible in an IFRAME, meaning if I make is scrollable horizonatlly, can it accomodate so many colums?

Fixthebug2003
 
Upvote 0 Downvote

AFAIK, there is no restriction to the maximum width of data an iframe can accomodate.

Why not just try it? You won't break anything, and sometimes answering your own questions can feel very rewarding.

Hope this helps,
Dan
 
Upvote 0 Downvote
Hi,
I am trying this in the IFRAME. But I am not able to accomadate there columns elvenly the right spacing.
I have a simple table, as a test, in a HTML file which is the SRC for the IFRAME. The IFRAME is scrollable.

The table is like this:
<table id="itab" border=0 cellspacing=0 cellpadding=0>
<tr class="label">
<td width="10px">&nbsp;</td>
<td width="120px">column 1</td>
<td width="60px"><a href="#">column </a></td>
<td width="160px">column 3</td>
<td width="100px">column 4</td>
<td align="center" width="60px"> <input type="checkbox" name="chk"></input> </td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
<td width="60px"><input type="checkbox" name="chk"></input></td>
</tr>
</table>


But this table doesnt span horizonatally, as the width specified in the cell. The total horizontal width is 1170px.
Looks lie IE squeezes the width within 900px?

can someone please help?

Fixthebug2003
 
Upvote 0 Downvote

You are specifying the width using CSS syntax in HTML. You should, AFAIK, not specify units when in HTML. Units are assumed to be in PX. That aside, you also haven't specified the table width either, and as some of your cells do not have fixed-width content, this could be an issue. Try this and see what it does:

Code: 
<table width="1170" id="itab" border="0" cellspacing="0" cellpadding="0">
<tr class="label">
	<td width="10">&nbsp;</td>
	<td width="120">column 1</td>
	<td width="60"><a href="#">column</a></td>
	<td width="160">column 3</td>
	<td width="100">column 4</td>
	<td width="60" align="center"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
	<td width="60"><input type="checkbox" name="chk"></input></td>
</tr>
</table>

Hope this helps,
Dan
 
Upvote 0 Downvote
Thanks a lot BillyRayPreachersSon !!
It was the units ("px") thing...now it works well !

So if we don't specify the units explicitly in "px" ..isn't the default in pixel? So what is the difference?
 
Upvote 0 Downvote

HTML values for width and height are always specified in pixels, so do not need a unit specifier (in fact, as you've found - if you do specify one, it messes some things up).

CSS values can be in any one of a number of units, so need a unit specifier to work correctly.

Dan
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
822
lexer
lexer
Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
2K
Mike Lewis
Mike Lewis
JScannell
  • Locked
  • Question
Javascript events
Replies
1
Views
409
Daniel K
Daniel K
Marclem
  • Locked
  • Question
javascript:navigator.registerProtocolHandler
Replies
1
Views
397
Marclem
Marclem
JScannell
  • Locked
  • Question
Javascript issue on iPhone/iMac platforms
Replies
0
Views
793
JScannell
JScannell

Part and Inventory Search

Sponsor

Back
Top