Scrolling iFrame content to the right with JS

Discussion in 'JavaScript' started by upiorz, Mar 18, 2008.

  1. #1
    Hi I'm searching for a script to shift (scroll) the contents of an iFrame 50 pixels towards the right upon loading.

    In a nutshell the iFrame will be loading a 200x50px picture, the iFrame is only 150px wide with it's scrollbars disabled and I would like the pic to be showing it's right side (scrolled 50px to the right upon load).

    Here's how far I got (I know it's not much)

    <iframe src="http://www.mysite.com/weatherBox.htm" align="right" frameborder="0" marginwidth="1" marginheight="0" scrolling="No" width="150" height="50" ></iframe>

    I thought align="right" would do the trick but didn't work

    If anybody knows of a good tut or a code snippet that could help, I would greatly appreciate anything.

    Thanks in advance.

    Diego.-
     
    upiorz, Mar 18, 2008 IP
  2. psyberweb

    psyberweb Peon

    Messages:
    585
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    0
    #2
    <iframe src="http://www.mysite.com/weatherBox.htm" align="right" frameborder="0" marginwidth="1" marginheight="0" scrolling="No" width="150" height="50" ><div style="float:right; margin-left:50px;"><img src="" border="0"></div></iframe>

    try this, it might work havent tried it though...
     
    psyberweb, Mar 18, 2008 IP
  3. upiorz

    upiorz Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thanks for your reply psyberweb, it didn't really do anything different, I tried it on FireFox and MSIE, no positive result on either one.
     
    upiorz, Mar 19, 2008 IP
  4. vpguy

    vpguy Guest

    Messages:
    275
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #4
    That's because if you specify a src for the <iframe>, it's going to load that page and disregard the content between the <iframe> ... </iframe> tags.

    You might be able to do it by trying one of the following two options:

    1) Give the <iframe> a name, then add the following code to the parent document:

    <script type="text/javascript">
    window.frames["[I]iframe_name[/I]"].document.body.scrollLeft = 50;
    </script>
    Code (markup):
    2) If you can modify the source code of the document which gets loaded into the <iframe>, change its <body> tag so that it looks something like this:

    
    <body onload="document.body.scrollLeft = 50;">
    
    Code (markup):
    Choose only one of the above two options. #2 is probably the better one, as long as the document is never used outside of the <iframe>.

    If the page which gets loaded into the <iframe> is from a different domain than the parent, then option #1 will probably not work for security reasons. If it doesn't work and #2 is out of the question, then you are probably out of luck.
     
    vpguy, Mar 19, 2008 IP
  5. upiorz

    upiorz Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Thanks vpguy you gave me a much better insight on what I'm looking for, this still doesn't quite work but at least I've been pointed in a certain direction.

    So much for nothing's impossible huh?

    I'll keep trying, if I figure this out, I'll post my findings.

    In the meantime if anybody else has any faint ideas, I'll give them a shot too..

    Cheers.:cool:
     
    upiorz, Mar 19, 2008 IP