iframe scrolling

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

iframe scrolling

Post by JellyFish »

Is there a way to scroll to a specific position for an iframe of a separate domain with javascript? For example, could I move the scroll position to x:100, y:200 on an iframe that has the src attribute or "http://yahoo.com"?

Basically what I'm trying to do is clip any webpage to a specific position and dimension. Is there some way to do this?

I appreciate all help on this.
tech603
Forum Commoner
Posts: 84
Joined: Thu Mar 19, 2009 12:27 am

Re: iframe scrolling

Post by tech603 »

Yes this can be done by setting using the style attribute in the iframe for example something like below would set the position from the top border and the left border.
style="position:absolute;Left:15;Top:100">

Hope that helps
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: iframe scrolling

Post by kaszu »

He is asking about the scrolling position, not iframe position.
Google returned me this
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Re: iframe scrolling

Post by JellyFish »

kaszu wrote:He is asking about the scrolling position, not iframe position.
Google returned me this
I'm not a member of experts-exchange.com (Btw, good thing they put a "-" inbetween experts and exchange. LOL).
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: iframe scrolling

Post by Christopher »

I googled and found this which I tested and it works (Mozilla). It sets the body margin, so I assume that you could scroll both direction, animate, etc.

Code: Select all

<html>
<head>
</head>
<body>
    <iframe id="iframe1" style="height: 200px; width: 200px;"></iframe>
    <script type="text/javascript">
    var t = window.document.getElementById("iframe1");
    t.src= "mypage.html";
    t.onload = function()
    {
        t.contentWindow.document.body.style.marginLeft = "-100px";
    }
    </script>
</body>
</html>
(#10850)
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Re: iframe scrolling

Post by JellyFish »

arborint wrote:I googled and found this which I tested and it works (Mozilla). It sets the body margin, so I assume that you could scroll both direction, animate, etc.

Code: Select all

<html>
<head>
</head>
<body>
    <iframe id="iframe1" style="height: 200px; width: 200px;"></iframe>
    <script type="text/javascript">
    var t = window.document.getElementById("iframe1");
    t.src= "mypage.html";
    t.onload = function()
    {
        t.contentWindow.document.body.style.marginLeft = "-100px";
    }
    </script>
</body>
</html>
This would work only if the "mypage.html" part was mine. I'm trying to do this cross-domain, which means I can't access the document object of the iframe. If I could access the document object of the iframe, I think I would just use window.scrollTo(x,y).
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: iframe scrolling

Post by Christopher »

What if you created a script on your site that would proxy the pages your want (e.g., mypage.php?url=http://somesite.com/somepage.html)
(#10850)
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Re: iframe scrolling

Post by JellyFish »

arborint wrote:What if you created a script on your site that would proxy the pages your want (e.g., mypage.php?url=http://somesite.com/somepage.html)
I guess I could do that, but are there any security risks involved? And what about bandwidth issues?
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: iframe scrolling

Post by Christopher »

If you always know what the remote pages will be then you can make it secure by not passing parameters and having "sitefoo.php" and "sitebar.php" or passing IDs for pages that you lookup to check if they exist like "site.php?id=foo"
(#10850)
Post Reply