Have swf video link to new page with html/csss?

Question

so i have a swf with a simple animation- the div used to contain it has a border that changes color when you hover- i want the whole thing to link to a new page when clicked- but right now it only works when you click on the border.

heres what i have so far

(a href="http://" class="noDecoration" ) (div id="ink" class="galleryBox" ) (/a)

-the div displays the swf object is it possible to do this from html?

thanks

Answer 1

flash objects capture mouse clicks, so you'd have to put the link navigation code inside the flash code, usually an onRelease and gotoUrl (I'm not a flash developer, i don't know specifics).

The only way i could think to do this would be a hack and not supported in all browsers, you would put a semi-transparent div ontop of the flash content, and that would have the link. the problem is that most linux flash players and others will simply always be on top, no matter the z-index you set.

Answer 2

One solution to the problem would be to place the link inside the div, and position it on top of the swf as an overlay.

Just make sure that the swf has the wmode param set to transparent as otherwise you won't be able to put HTML object on top of the swf. I usually use swfObject to embed my swfs, incase you didn't know about it.

HTML

<div id="ink" class="galleryBox">
    <object width="500" height="500" type="application/x-shockwave-flash" data="filename.swf">
        <param name="wmode" value="transparent">
    </object>
    <a href="http://" class="noDecoration"></a>
</div>

CSS

#ink {
    position:relative; width:500px; height:500px;
}
#ink a {
    display:block; position:absolute; top:0; left:0; width:100%; height:100%;
}