PDA

View Full Version : Multiple Scrollable Iframes Help



fsindustries
09-03-2007, 07:01 AM
Alright I found another thread that states the answer to this question but I couldn't understand or it just won't work in firefox or something...

I've got 3 iframes on one page, using the Scrollable Iframe script here at DD
(http://www.dynamicdrive.com/dynamicindex17/iframescroll.htm), and it works except that they all wanna scroll at the same time, and that's not what I need is for them each to scroll independently, the first two have one page each, an About Section and a Updates Section, where the other one is for the site content itself.

I found an answer which stated the following:

"The solution is easy, but time consuming, there may be a more efficient way, but sorry, I am not finding out for you. You have to change only one thing, but you have to change it about 10 times. The scrollspeed variable. If you change it to scrollspeedone, scrollspeedtwo, etc (on the main page in the up/down mouseovers/outs, and in the framed page, window.parent.scrollspeed) just change scroll speed to anything, but do it consistently, and it will work."

But when I do what it says there the About doesn't scroll at all while the Update scrolls down and then won't scroll back up, and causes me to have to open the Main page all over again.

Typing the script up again would be fantastic, but further explaining what it is I need to do would be extremely appreciated as well.

Thanks,
Tyler

jscheuer1
09-03-2007, 08:51 AM
The top page:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

</head>
<body>
<!--Scrollable iframe script- By Dynamic Drive-->
<!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com-->
<!--This credit MUST stay intact for use-->

<iframe src="external.htm" width=150 height=150 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=1 scrolling=no></iframe>

<layer visibility=hide>
<div style="width:150px;" align="right">
<a href="#" onMouseover="scrollspeed=-2" onMouseout="scrollspeed=0">Up</a> | <a href="#" onMouseover="scrollspeed=2" onMouseout="scrollspeed=0">Down</a>
</div>
</layer>
<!--Scrollable iframe script- By Dynamic Drive-->
<!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com-->
<!--This credit MUST stay intact for use-->

<iframe src="external2.htm" width=150 height=150 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=1 scrolling=no></iframe>

<layer visibility=hide>
<div style="width:150px;" align="right">
<a href="#" onMouseover="scrollspeed2=-2" onMouseout="scrollspeed2=0">Up</a> | <a href="#" onMouseover="scrollspeed2=2" onMouseout="scrollspeed2=0">Down</a>
</div>
</layer>
</body>
</html>

external.htm


<html>
<body>

<!-- ADD YOUR SCROLLER CONTENT INSIDE HERE -->
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla massa. Vestibulum pellentesque arcu a pede. Mauris tincidunt sagittis neque. Nulla ac libero. Phasellus orci purus, semper a, venenatis nec, commodo ac, quam. Praesent scelerisque dui id nibh. Etiam ac diam non pede fermentum interdum. Praesent velit enim, ornare sollicitudin, mollis et, porta vehicula, nibh. Suspendisse non dui sed arcu congue tempus. Fusce lorem sapien, faucibus ut, consectetuer vitae, condimentum et, nulla. Sed egestas purus. Aliquam malesuada. Nam id arcu sed urna aliquam lobortis. Sed laoreet. Phasellus at nibh. Nulla at pede. Morbi vel est facilisis purus sodales pharetra. Nulla diam leo, accumsan a, pretium et, imperdiet id, tellus. Vestibulum fringilla est vitae justo.

<!-- END SCROLLER CONTENT -->

<!--DO NOT REMOVE BELOW SCRIPT. IT SHOULD ALWAYS APPEAR AT THE VERY END OF YOUR CONTENT-->
<script type="text/javascript">

//Scrollable content III- By http://www.dynamicdrive.com

var speed, currentpos=curpos1=0,alt=1,curpos2=-1

function initialize(){
if (window.parent.scrollspeed!=0){
speed=window.parent.scrollspeed
scrollwindow()
}
}

function scrollwindow(){
temp=(document.all)? document.body.scrollTop : window.pageYOffset
alt=(alt==0)? 1 : 0
if (alt==0)
curpos1=temp
else
curpos2=temp

window.scrollBy(0,speed)
}

setInterval("initialize()",10)

</script>

</body>
</html>


external2.htm


<html>
<body>

<!-- ADD YOUR SCROLLER CONTENT INSIDE HERE -->

<b>What's Hot</b></p>
<p align="left"><strong><font face="Verdana"><small><a href="http://www.dynamicdrive.com/dynamicindex9/encrypter.htm" target="_top">Source
code encrypter</a>&nbsp;</small></font></strong><br>
<font face="Verdana" size="2">Scramble the source of any chunk of code using
this unique script.</font></p>
<p align="left"><strong><font face="Verdana"><small><a href="http://www.dynamicdrive.com/dynamicindex5/flashlink.htm" target="_top">Flashing
links</a>&nbsp;</small></font></strong><br>
<font face="Verdana"><small>Bring attention to special links, by making them
flash!</small></font></p>
<p align="left"><small><strong><font face="Verdana"><a href="http://www.dynamicdrive.com/dynamicindex13/roamcursor.htm" target="_top">Roaming
Cursor</a>&nbsp;</font></strong></small><br>
<small><font face="Verdana">Display a second, &quot;roaming&quot; cursor on your
page with this fun animation script.</font></small></p>
<p align="left"><font face="Verdana"><strong><a href="http://www.dynamicdrive.com/dynamicindex11/animatedtitle.htm" target="_top"><small>Animated
Document title</small></a><br>
</strong><small>Animate into view your document's title!</small></font>

<!-- END SCROLLER CONTENT -->


<!--DO NOT REMOVE BELOW SCRIPT. IT SHOULD ALWAYS APPEAR AT THE VERY END OF YOUR CONTENT-->
<script type="text/javascript">



//Scrollable content III- By http://www.dynamicdrive.com

var speed, currentpos=curpos1=0,alt=1,curpos2=-1

function initialize(){
if (window.parent.scrollspeed2!=0){
speed=window.parent.scrollspeed2
scrollwindow()
}
}

function scrollwindow(){
temp=(document.all)? document.body.scrollTop : window.pageYOffset
alt=(alt==0)? 1 : 0
if (alt==0)
curpos1=temp
else
curpos2=temp

window.scrollBy(0,speed)
}

setInterval("initialize()",10)

</script>

</body>
</html>