I've been sent a swf file for a banner that needs to be linked to a url. I am adding this to my client's website and my client has been sent the swf and javascript to add to the page. The problem is that the javascript code is overly complex, and I'm wanting to use Jquery and Unobtrusive Flash Objects (I've not yet updated to swfobject on this site). Can I use Jquery and/or UFO (or indeed swfobject if I have to upgrade) to make the swf file link to an external url (preferably loading in a new tab/window)? I don't have any knowledge of actionscript or flash. Any help on this would be appreciated!
+1
A:
You need to create a link inside the Flash file, using Action Script.
It's pretty easy to do this, check out the answer here.
Alternatively, something like this might work. Basically a transparent anchor tag that is position over the flash banner.
var $flash = $("#id-of-flash-object tag").
var $flashLink = $("<a />")
.attr("href", "http://www.google.co.nz")
.css({
'position': 'absolute',
'width': $flash.width(),
'height': $flash.height(),
'top': $flash.offset().top,
'left': $flash.offset().left
});
$("body").append($flashLink);
You might need to change the wmode of the object tag to "transparent".
(this hasn't been tested)
Marko
2010-10-01 10:25:50
The advertiser has only sent the swf file (as well as the example html file with horrible javascript to make it into a link). They won't want to send me the .fla file and in anycase I was hoping I could create the link using javascript (and in particular using jQuery)
baritoneuk
2010-10-01 10:30:10
I've just tried your 2nd solution, and after some time I've managed to get this working. I had tried a similar solution before just using css to add an overlayed transparent anchor tag but it didn't work in IE. Your solution (using Javascript) makes this work. As the main content is centered I had to set the left to 50% and then use a negative left margin, but it's worked. I'd still like to know if I can set the link using javascript or JQuery. Is this possible or does this have to be done by editing the .fla file?
baritoneuk
2010-10-01 10:46:30
Yep, you're setting the link using the `.attr("href", "http://some-link")`. Please note that this can be done as a CSS only solution, with the link absolutely positioned in the object's parent. The parent will need to be relatively positioned, let me know if you prefer that solution instead.
Marko
2010-10-01 10:54:13
Thanks, I think it's best that I mark this as the solution as although it's a work around, it might be the only way without editing the .fla file. Thanks for your help.
baritoneuk
2010-10-01 11:17:04