Search code examples
htmlembedswfobject

Embedd a flash element and make unclickable


I am trying to embed this flash banner in side but url on it is messed up. So I placed an invisible div on it with the correct url . The trouble is when I click on it, I get transferred to both the correct url and the incorrect one.

<div class="invisible" onmousedown="window.open('http://ags.gns.co.il/cdn/DigitalCloud/iMarkets/2012/Gadi_Back_To_News/?Media=maof')" style="z-index:10000">
   <object type="application/x-shockwave-flash" data="http://s-maof.com/stuff/Imarkets_150x75.swf" width="150" height="75">
        <param name="movie" value="http://s-maof.com/stuff/Imarkets_150x75.swf" />
        <param name="quality" value="high" />
        <param name="wmode" value="transparent" />
        <param name="loop" value="false" />
   </object>
</div>

Solution

  • You are not overlaying the flash, you are just containing it !
    try this html:

    <div class="invisible">
       <a class="overlay" href="http://ags.gns.co.il/cdn/DigitalCloud/iMarkets/2012/Gadi_Back_To_News/?Media=maof"></a>
       <object type="application/x-shockwave-flash" data="http://s-maof.com/stuff/Imarkets_150x75.swf" width="150" height="75">
            <param name="movie" value="http://s-maof.com/stuff/Imarkets_150x75.swf" />
            <param name="quality" value="high" />
            <param name="wmode" value="transparent" />
            <param name="loop" value="false" />
       </object>
    </div>​​​
    

    now we set the link to overlay the flash

    .invisible{
     position:relative;
     width:150px;
     height:75px;
    }
    .​overlay{
     z-index:10000; 
     display:block;
     width:150px;
     height:75px;
     position:absolute;
     top:0px;
     left:0px;
     background:red; 
     opacity:0.3;    
    }​
    

    DEMO
    you can remove the opacity and background, they are just for demonstration.