How to scroll parent window from iframe using JQuery

First off I’m using JQuery 1.4 and I’ve got the ScrollTo plugin referenced in my webpage. In order to provide a rich experience to my users, I wanted to load an iframe through facebox when someone submitted a comment (this is not implemented on this website btw) and ask them to provide their email address for follow-ups. If they supplied their email address, I wanted to close the iframe and insert a message in the parent page to tell them that an email has been sent to them.

Now the user can be at the bottom of the page when they submit the comment and the message will be appended at the top of the parent page. So I need to scroll to the top of the page so that they can see the message. I tried the following:

parent.$.scrollTo($("#FeedbackDiv", 1000);

But that didn’t work and it took me quite a while to figure out what went wrong. When on the iframe, parent.$.scrollTo successfully finds the scrollTo plugin but it doesn’t find the FeedbackDiv because it’s located on the parent page and not the iframe. The way the code is at the moment, it’s looking for a FeedbackDiv in the iframe and not the parent window. So to achieve what I wanted, all you have to do is the following:

parent.$.scrollTo(parent.$("#FeedbackDiv"), 1000);

And now everything works perfectly 🙂

comments powered by Disqus