Change Parent url from iframe

Question

Need help with a simple problem! which has the following criteria:

1) click on images link in iframe changes Parent page, click on another iframe image link changes

Answer 1

http://reference.sitepoint.com/html/a/target

"_top"

loads content in the top-level frameset (in effect, the whole browser window), no matter how many nested levels down the current frame is located

<a href="page" target="_top">Replace parent url!</a>

Answer 2

In my case I used the following

if (window.self !== window.top) { // checking if it is an iframe
  window.parent.location.href = websiteUrl;
} else {
  window.location.href = websiteUrl;
}

Answer 3

In case @biziclop decides to delete his answer as he seems to be threatening to do in the comments, here's his answer again which is very useful:

http://reference.sitepoint.com/html/a/target

"_top"

loads content in the top-level frameset (in effect, the whole browser window), no matter how many nested levels down the current frame is located

<a href="page" target="_top">Replace parent url!</a>

Answer 4

Change your link from this:

<a href="link-here.html">

To this:

<a href="#" onclick="top.window.location.href='yourURL';">

If you want, you could just put the onclick handler on the image instead and get rid of the anchor.

Note that this is not the correct place to have javascript (handlers should be bound from a .js file, not in markup), but i get the feeling you are looking for a surgical answer and don't care much for best practices.

edit: as Victor Nicollet pointed out, this will throw a security exception if your iframe and parent page do not share domains. see http://en.wikipedia.org/wiki/Same_origin_policy