I have an iframe with a default source, but want to be able to change the source of this to a different address when someone clicks one of a number of links below it.
My initial code is:
which should change the src attribute of this when one of the links is clicked:
<iframe id="iframe_style" src="http://www.yudu.com/item/embedded_reader/283726/News-Beat?refid=83508">We're sorry, your browser doesn't support IFrames. You can still <a href="http://www.yudu.com/item/details/283726/News-Beat?refid=83508">visit this item.</a>, however.
And an example of one of the links is this:
<li><a href="http://www.yudu.com/item/embedded_reader/284894/News-Beat?refid=83508" onClick="changesrc('iframe_style','http://www.yudu.com/item/embedded_reader/284894/News-Beat?refid=83508');return false"><img src="http://www.yudu.com/item_thumbnail/28/3726/994216f08/thumb/page1.jpg" alt="December 2010" style="border: 0;" /><p>December</p></a></li>
With the above the scr of the iframe gets changed but only to 0. so what obviously isn't happening is it is not retrieving the value in the link and returning it to the iframe src.
Hope some of that made sense??
Please let me know if I've gone about this the wrong way and I need to completely re-think what I've done so far.
Well that's exactly what the function has been hard-coded to do. You're passing it two parameters but it only reads one.
<a ........... onClick="changesrc( 'iframe_style', this.href );return false">
function changesrc(iframe_style, href)
There are no security issues with applying foreign domains to the .src of an iframe.