Results 1 to 10 of 10

Thread: Help with Iframe scroller: Horizontal Scrolling Possible?

  1. #1
    Join Date
    Sep 2004
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Help with Iframe scroller: Horizontal Scrolling Possible?

    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!!

  2. #2
    Join Date
    Sep 2004
    Location
    Indonesia
    Posts
    69
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    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

    Code:
    <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():

    Code:
    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...
    Last edited by gigabites; 09-22-2004 at 11:29 PM. Reason: forgot something...

  3. #3
    Join Date
    Sep 2004
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Tanx

    Allrite m8, tanx a lot! It works great!

  4. #4
    Join Date
    Oct 2004
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    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...

  5. #5
    Join Date
    Aug 2004
    Location
    Brighton
    Posts
    1,563
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    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
    A retired member, drop me a line through my site if you'd like to find me!
    cr3ative media | read the stickies

  6. #6
    Join Date
    Sep 2006
    Posts
    53
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

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

    thanks

  7. #7
    Join Date
    Feb 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by gigabites View Post
    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

    Code:
    <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():

    Code:
    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??

  8. #8
    Join Date
    Mar 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default iframe scroller in rapidweaver

    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

  9. #9
    Join Date
    Aug 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

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

  10. #10
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Please start a new thread for a new question.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •