How do I set a flash object to open a url in a new window?

14,827

You can position a DIV over your flash object to capture the mouse click. To do this, you need to set the wmode of the flash object to opaque, and use some javascript to position the div. Here's a full example:

<html>
<head>
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
    var flashvars = {};
    var params = {
        menu: "false",
        scale: "noScale",
        wMode: "opaque"
    };
    swfobject.embedSWF("MyFlashApp.swf", "swf", "300", "300", "9.0.0",
                       "expressInstall.swf", flashvars, params);

    $(function() {
        var swf = $("#swf");
        $("body").append(
            $("<div onclick=\"window.open('http://www.google.com');\"></div>").
                css({
                    position: 'absolute',
                    top: swf.offset().top,
                    left: swf.offset().left,
                    width: swf.attr('width'),
                    height: swf.attr('height'),
                    zIndex: 1
                })
        );
    });
</script>
</head>
<body>
<div id="swf"></div>
</body>
</html>

Note the use of swf.attr('width') instead of swf.width(), the latter returns 0, probably because it's too early to get the flash object's dimensions. Later on, when called by hand, it does return the correct value.

Share:
14,827
Keith Donegan
Author by

Keith Donegan

Just another Developer...

Updated on June 04, 2022

Comments

  • Keith Donegan
    Keith Donegan almost 2 years

    I have this code:

    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="300" height="250">
      <param name="movie" value="Spotify_premium_300x250.swf" />
      <param name="quality" value="high" />
      <embed src="Spotify_premium_300x250.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="300" height="250"></embed>
    </object>
    

    EDIT: Code from Tom

    <object onclick="javascript: window.open('http://www.stackoverflow.com', _blank, 'width=1024, height=600, menubar=no, resizable=yes');" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="300" height="250">
      <param name="movie" value="Spotify_premium_300x250.swf" />
      <param name="quality" value="high" />
      <embed src="Spotify_premium_300x250.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="300" height="250"></embed>
    </object>
    

    I would like it as when a user clicks the flash object, it's opens a URL in a new window. How would I go about doing this?

    Cheers, Keith