I've tried wrapping the object like this:

<a href="http://www.mysite.com"><object type="application/x-shockwave-flash"
 width="960" height="157"
 data="http://www.mysite.com/flash/myflash.swf">
<param name="movie"
 value="http://www.mysite.com/flash/myflash.swf"></param>
<param name="wmode" value="transparent"></param>
<img src="http://www.mysite.com/images/mystaticimage.jpg"
 width="960" height="157" alt="" title=""/>
</object>
</a>

Strangely it seems to work in Firefox but not any other browser.

Yes, I know it's possible to natively embed a hyperlink in flash.
But in this case its not what I want to do.
The link has to be applied programmatically because it will contain a different query string each time.

Any ideas?

Well for one thing, that's not valid. Have you tried wrapping it in a span?

Originally Posted by LadynRed

Well for one thing, that's not valid. Have you tried wrapping it in a span?

I didnt realize that <param> was a self enclosing tag in XHTML so thanks for the heads up on that one. It doesnt really have any bearing on the problem though.

I tried nesting the <object> inside a <span> and then nesting THAT inside the anchor tags but still no dice. Same thing with using <div> tags.

What I finally did was create a fully transparent GIF file, the same dimensions as the SWF and float that over the top within a containing DIV like this.

<div style="position:relative;">

<a href="http://www.mysite.com">
<img style="position:absolute; z-index: 1000;" src="http://www.mysite.com/images/transparent.gif" />
</a>

<object type="application/x-shockwave-flash"
 width="960" height="157"
 data="http://www.mysite.com/flash/myflash.swf">
<param name="movie"
 value="http://www.mysite.com/flash/myflash.swf" />
<param name="wmode" value="transparent" />
<img src="http://www.mysite.com/images/mystaticimage.jpg" width="960" height="157" alt="" title=""/>
</object>

</div>

Not pretty. But it works.

I think you can do the same with a tag (without image) if you define absolute, z-index, height, width and display.
.overswf{
position: absolute;
z-index: 1000;
height: 157px;
width: 960px;
display: block;
}

<div style="position:relative;">

<a class="overswf" href="http://www.mysite.com"> </a>

<object type="application/x-shockwave-flash"
width="960" height="157"
data="http://www.mysite.com/flash/myflash.swf">
<param name="movie"
value="http://www.mysite.com/flash/myflash.swf" />
<param name="wmode" value="transparent" />
<img src="http://www.mysite.com/images/mystaticimage.jpg" width="960" height="157" alt="" title=""/>
</object>

</div>

I didn't test it but I think it will work.

Originally Posted by shivaji

I think you can do the same with a tag (without image) if you define absolute, z-index, height, width and display.
.overswf{
position: absolute;
z-index: 1000;
height: 157px;
width: 960px;
display: block;
}

<div style="position:relative;">

<a class="overswf" href="http://www.mysite.com"> </a>

<object type="application/x-shockwave-flash"
width="960" height="157"
data="http://www.mysite.com/flash/myflash.swf">
<param name="movie"
value="http://www.mysite.com/flash/myflash.swf" />
<param name="wmode" value="transparent" />
<img src="http://www.mysite.com/images/mystaticimage.jpg" width="960" height="157" alt="" title=""/>
</object>

</div>

I didn't test it but I think it will work.

Unfortunately it doesn't work with any version of IE or in Opera.
I even tried adding a period mark between the anchor tags but didnt work.
I think <a> tags in those browsers only take on the proportions of whatever they enclose.

what version of IE are you using. the tags work in IE for me.

Originally Posted by saint71

what version of IE are you using. the tags work in IE for me.

Tried it in both IE7 and IE8.

It's not that they don't "work", it's that the clickable area doesnt cover
the Flash movie behind it.

Thanks For sharing this useful information.keep sharing more and more in future.
Thanks & Regards
Allan Swagger

the reason for that behavior is probably that browsers usually render Flash on top of everything else on the page and also it's an activeX object.

As for your solution you can have an empty button in flash that will cover the whole stage and have it open the url you want.
If you want the url to be changing dynamically you can get flash either query the server side script on read url from an xml file, all depends on what you're trying to achieve

Originally Posted by mushget

the reason for that behavior is probably that browsers usually render Flash on top of everything else on the page and also it's an activeX object.

As for your solution you can have an empty button in flash that will cover the whole stage and have it open the url you want.
If you want the url to be changing dynamically you can get flash either query the server side script on read url from an xml file, all depends on what you're trying to achieve

Muppet..

did you read the OP?

Originally Posted by TWD

Tried it in both IE7 and IE8.

It's not that they don't "work", it's that the clickable area doesnt cover
the Flash movie behind it.

maybe link and object should be placed on different div layers, each with absolute coordinates.

TWD has the answer. I use position:absolute, without top and left [only margins]
The style can be on <a> so you don't have to make 2 layers

<style type="text/css">
.overFlash { width:960px; height:157px; overflow:hidden; position:absolute;
font-size:1px; line-height:0; margin:0 /* no necessarily, but it's better */ }
.overFlash img { width:960px;height:157px;margin:0;padding:0 }
</style>

<a href="somelink" class="overFlash"><img src="blank.gif" alt="" /></a>
<object type="application/x-shockwave-flash"
........................... </object>

interesting information, thanks