Help with Iframe scroller: Horizontal Scrolling Possible?

[Chin-Tok]

Hello,

I would like to use the Iframe scroller you guys have:
http://www.dynamicdrive.com/dynamici...e-scroller.htm
However I need it to scroll from left to right, so like horizontally. Is this possible? Or do I need another script for this?

Thanx for any help!!

[gigabites]

Ok, I think first you'll have to modify the content to look more 'horzontal'. Use table with one row and several columns... Like this for an example

<table>
<tr><td valign="top">
<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>
</td><td valign="top">
<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>
</td><td valign="top">
<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>
</td><td valign="top">
<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>
</td></tr>
</table>

Change thelength=dataobj.offsetHeight to thelength=dataobj.offsetWidth in function getdataheight()

Replace all style.top to style.left in function initializeScroller() and function scrollDiv():

function initializeScroller(){
dataobj=document.all? document.all.datacontainer : document.getElementById("datacontainer")
dataobj.style.left="5px"
setTimeout("getdataheight()", initialdelay)
}

function getdataheight(){
thelength=dataobj.offsetWidth
if (thelength==0)
setTimeout("getdataheight()",10)
else
scrollDiv()
}

function scrollDiv(){
dataobj.style.left=parseInt(dataobj.style.left)-scrollspeed+"px"
if (parseInt(dataobj.style.left)<thelength*(-1))
dataobj.style.left="5px"
setTimeout("scrollDiv()",40)
}

It's a very very simple modification, but I hope that'll do the trick..

Feel free to ask again if You want to change something else...

Oh, and all of them are in external.htm...

[Chin-Tok]

Allrite m8, tanx a lot! It works great!

[clivewalker]

Is it possible to move this horizontally to the right instead of left? I tried changing style.top to style.right in function scrollDiv and in function initializeScroller but this does not appear to work.

function scrollDiv(){
dataobj.style.right=parseInt(dataobj.style.right)-scrollspeed+"px"
if (parseInt(dataobj.style.right)<thelength*(-1))
dataobj.style.right="5px"
setTimeout("scrollDiv()",40)
}

function initializeScroller(){
dataobj=document.all? document.all.datacontainer : document.getElementById("datacontainer")
dataobj.style.right="5px"
setTimeout("getdataheight()", initialdelay)
}

Function getdataheight was also changed to

function getdataheight(){
thelength=dataobj.offsetWidth
if (thelength==0)
setTimeout("getdataheight()",10)
else
scrollDiv()
}

Thanks - any help appreciated...

[cr3ative]

With code like this, top, bottom, right and left are all different: For example.

Left = pixels away from left edge
Right doesn't exist except for in string handling
Top = pixels away from top edge
Bottom doesn't exist.

cr3ative

[taydu]

so how to make it scroll from the right to the left??

thanks

[edb5020]

Ok, I think first you'll have to modify the content to look more 'horzontal'. Use table with one row and several columns... Like this for an example

<table>
<tr><td valign="top">
<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>
</td><td valign="top">
<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>
</td><td valign="top">
<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>
</td><td valign="top">
<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>
</td></tr>
</table>

Change thelength=dataobj.offsetHeight to thelength=dataobj.offsetWidth in function getdataheight()

Replace all style.top to style.left in function initializeScroller() and function scrollDiv():

function initializeScroller(){
dataobj=document.all? document.all.datacontainer : document.getElementById("datacontainer")
dataobj.style.left="5px"
setTimeout("getdataheight()", initialdelay)
}

function getdataheight(){
thelength=dataobj.offsetWidth
if (thelength==0)
setTimeout("getdataheight()",10)
else
scrollDiv()
}

function scrollDiv(){
dataobj.style.left=parseInt(dataobj.style.left)-scrollspeed+"px"
if (parseInt(dataobj.style.left)<thelength*(-1))
dataobj.style.left="5px"
setTimeout("scrollDiv()",40)
}

It's a very very simple modification, but I hope that'll do the trick..

Feel free to ask again if You want to change something else...

Oh, and all of them are in external.htm...

I tried this and it works great but the text does not come back around...It just scrolls left and dissappears. Any ideas??

[plisstrd]

I am having problems getting the iframe scroller to work in rapidweaver. I am using a stacks page and want to install in an extra content area.
See southbaytrikke.com. Notice the righthand corner. I want to use this there. I know this is not regular but any clues as to what I am doing wrong. I put code in the head section and the html in the page and I only see one bar of text.

Thank you for you time. There is some really useful stuff here.
Cool
Andy

[Dino77]

Have never worked with iframe before. and i tripped over not knowing how to embed only one part of a page with an iFrame?

[jscheuer1]

Please start a new thread for a new question.