Selteco.com > FlashDesignerZONE.com > Tutorials > T1090

Floating Flash banners

Flash banners over the web page

Flash ads can fly over the content. This example demonstrates how to create an X sign to close the banner.

Click x sign to close the banner, hit browser refresh button to show the banner back.

1. Run Alligator Flash Designer and open your banner
2. Choose Insert > Symbol and add x sign, you can also use any icon you wish

   

3. Select the x sign and choose Action > OnClick
4. Choose Get URL and paste the code: javascript:hideDiv('mybanner');

   

5. Click OK
6. Choose File > Export Flash SWF File and save your SWF file

The next step is to embed the banner in your HTML code

1. Open the page in your HTML editor and paste the code of hideDiv function

   <script language=javascript type='text/javascript'>
   function hideDiv(elementID) 
   { 
    if (document.getElementById) 
    { // DOM3 = IE5, NS6 
      document.getElementById(elementID).style.visibility = 'hidden'; 
    } 
   } 
   </script>
   

2. Place the banner inside double DIV tag

   <div style="position:relative;">
   <div id="mybanner" style="position:absolute; left:0px; top:0px;">
   
   ... paste the HTML code of your banner here, generate it with File > View HTML Code
   
   </div>
   </div>
   

Download source project t1091.zip (15 kb)