- Thursday, December 13, 2012 By David Peter
You can have a close button for the div. But better to have it, since the visitor view your website in lesser resolution, it overlappes on the contents. So to avoid clumpsy and give more freedom to the visitor, its better to have a close button.
Lets do it :
Step 1 : In the <head> Section of your html template, include the below CSS Styles.
Here you can set the Width and Height of the div you need. Due to space contraint, we have given 120x610px to accomodate a standard size of 120x600px advertisement. 10px is buffer to have the close button.
Color: black for the close button. Position should be fixed. Since the div should embed with the background of the website, background-color is not specified. You can specify any color you need to set for the background. If you want the space div to be placed on the right side, specify instead of left, right.
Step 2:If you have inlcude JQUERY already, retain it. If not, download the latest jquery from the here and include it in your head section.
Step 3: Include the below code wherever you want your Ad to be shown (Specifically after menu for the div to be shown as shown in the above figure.
<div id=”advt” class=”advt”><span id=”closeadvt” style=”cursor:pointer;”>Close X</span>
You Advertisement CODE Here.
fadeOut(“slow”); fadeout(1600); //1600 is the duration in seconds.