iframe's and inline code

[Andrew Poulos]

Rather than doing this


<script type="text/javascript">
foo = function() {
window["vid"].scrollTo(0,203);
};
</script>

<iframe onload="foo" name="vid" width="835" height="560"
src="http://www.vid.com/play?u=hup"></iframe>


to scroll the IFRAME after it loads I need to do it inline. Alas, this


<iframe onload="this.scrollTo(0,203)" name="vid" width="835"
height="560" src="http://www.vid.com/play?u=hup"></iframe>


returns the error that 'this.scrollTo is not a function' even though
'this' does refer to the IFRAME.

I've tried various permutations but I can't sort it out. How can I get
the IFRAME's content to scroll onload with inline code?

Andrew Poulos

 

[Martin Honnen]

<iframe onload="this.scrollTo(0,203)" name="vid" width="835"
height="560" src="http://www.vid.com/play?u=hup"></iframe>


returns the error that 'this.scrollTo is not a function' even though
'this' does refer to the IFRAME.

Well |this| is an iframe element object not a window object. You could try
this.contentWindow.scrollTo(0,203)
but frankly as http://www.vid.com/ is probably not the same origin as
the containing document you will simply get an access denied security
exception.

 

[Thomas 'PointedEars' Lahn]

Rather than doing this

<script type="text/javascript">
foo = function() {

There's an undeclared identifier left-hand side and an unnecessary function
expression right-hand side. Better:

function foo()
{

window["vid"].scrollTo(0,203);
};
</script>

<iframe onload="foo" name="vid" width="835" height="560" ^^^
src="http://www.vid.com/play?u=hup"></iframe>

to scroll the IFRAME after it loads I need to do it inline.

No, you simply forgot to *call* foo().

Alas, this

<iframe onload="this.scrollTo(0,203)" name="vid" width="835"
height="560" src="http://www.vid.com/play?u=hup"></iframe>

returns the error that 'this.scrollTo is not a function'

(In which runtime environment?)

even though 'this' does refer to the IFRAME.

To the *iframe* element object; _not_ to the proprietary Window object which
has this property. It would work with

<iframe name="vid" src="http://www.vid.com/play?u=hup"
width="835" height="560"
onload="window.frames[this.name].scrollTo(0,203)">
</iframe>

or

<iframe name="vid" src="http://www.vid.com/play?u=hup"
width="835" height="560"
onload="this.contentDocument.defaultView.scrollTo(0, 203)">
</iframe>

or

<iframe name="vid" src="http://www.vid.com/play?u=hup"
width="835" height="560"
onload="this.contentWindow.scrollTo(0, 203)">
</iframe>

but only if "www.vid.com" were the same domain (cf. Same Origin Policy), see
also <http://PointedEars.de/scripts/test/dom/iframe-scroll>.

BTW: The IFRAME element does _not_ have an `onload' attribute in Valid HTML
4.01, not even in the Transitional or Frameset variants. (Neither has the
OBJECT element.) For Valid HTML, you would need to try using the `onload'
attribute of the BODY element to add an event listener for the `load' event
of the IFRAME element dynamically.

But:

I've tried various permutations but I can't sort it out. How can I get
the IFRAME's content to scroll onload with inline code?

You better don't; try to use anchors instead, they work without scripting
and with foreign domains, too:

<iframe name="vid" src="http://foo.bar.example/baz?bla=burp#hello"
width="835" height="560">
</iframe>


PointedEars