Make webpage jump to top when link inside iframe is clicked

[lessdangerous]

My website uses a very tall iframe to display catalog pages from an external website. I'm using iframes here to make it look like the external catalog pages are on my webpages.

The problem is that when a visitor goes to my page, scrolls down to view all the contents inside the iframe, and then clicks a link inside the bottom of the iframe to goto the next page, that next catalog page will load inside the iframe, but the visitor will still be looking at the bottom of the iframe on my website, and thus has to scroll up to the top of my website to see the top of the iframe's contents.

To see exactly what I mean, go here, scroll down, and click the next page link: http://neatoincognito.com/catalog.html

How can I make it so when someone clicks a link inside the iframe, that the page with the iframe automatically scrolls to the top appearing as if the whole website has refreshed?

[lessdangerous]

If I'm not clear in what I'm asking please let me know. I still don't have a solution for this.

[Orc Scorcher]

I can't test this in any browser except Opera now but at least there it works so you might give it a try. Add the following after the iframe tags in your top frame:

<script>  
setTimeout(function () {
	function to_0_0() { scrollTo(0, 0) }
	var iframe = document.getElementById("logomall")
	try {
		iframe.addEventListener("load", to_0_0)
	}
	catch (e) {
		iframe.attachEvent("onload", to_0_0)
	}
}, 400)
</script>

[lessdangerous]

This is great! I have two issues though:

1) This works in Internet Explorer but not Firefox. What can be done to make this work in FF?

2) Is it possible for this scroll up trick to work when the new page first starts loading instead of after the page has completely loaded?

Thanks so much so far.

[Orc Scorcher]

Please change the code to

setTimeout(function () {
	function to_0_0() { scrollTo(0, 0) }
	var iframe = document.getElementById("logomall")
        iframe.onreadystatechange = to_0_0
	try {
		iframe.addEventListener("load", to_0_0)
	}
	catch (e) {
                alert(e.message)
                if (iframe.attachEvent)
  		   iframe.attachEvent("onload", to_0_0)
	}
}, 400)

then test the page in Firefox, see what the alert message is and remove the alert line. If it says something about security or denied access then you're probably out of luck.

MSDN claims that iframes support onreadystatechange, so that could maybe scroll the page up as soon as the page starts loading in IE. Good luck...

[CalumMc]

Its not that complicated! this code works in FF and other browsers!

put this in your head:

<script language="javascript">
function scrolltotop() {
scroll(0,0);
}
</script>

and add scrolltotop() as onload to your iframe!

<iframe name="iframe" onload="scrolltotop()">
Calum

[cdukesbic]

This latest option worked for me. Thanks so much!!! Easy as pie!

[kamodan]

Works like a charm.

Thank you, CalumMc!