HTML
First prepare creative and create ads main DIV # pop a user suspended in the body, is set to not show the title bar in the upper ads have close button is clicked off, then turn off the hidden suspended advertising.
<div id="pop" style="display:none;">
<div id="popHead">
<a id="popClose" title="Close">Close</a>
<h2>Sponsor ads</h2>
</div>
<div id="popContent">
<a href="http://www.goocode.net/" target="_blank"><img src="imgad.jpg"></a>
</div>
</div>
CSS
Using CSS a little landscaping #pop. Note In fact, we use position: fixed; right: 0; bottom: 0; in fact, it has been fixed at the lower right corner of the ad position, but to take into account those users of IE6, ie6 does not support fixed, the problem that we can come through jquery plugins ie6 compatible line problem solving.
#pop{background:#fff;width:300px; height:282px;font-size:12px;position:fixed;right:0;bottom:0;}
#popHead{line-height:32px;background:#f6f0f3;border-bottom:1px solid #e0e0e0;font-size:12px;
padding-left:10px;}
#popHead h2{font-size:14px;color:#666;line-height:32px;height:32px;}
#popHead #popClose{position:absolute;right:10px;top:1px;}
#popHead a#popClose:hover{color:#f00;cursor:pointer;}
jQuery
The suspension advertising effectiveness depends on jQuery, so when the page loads do not forget to load the jQuery library file.
function Pop(){
this.apearTime=1000;
this.hideTime=500;
this.delay=10000;
//Show
this.showDiv();
//close
this.closeDiv();
}
Pop.prototype={
showDiv:function(time){
if (!($.browser.msie && ($.browser.version == "6.0") && !$.support.style)) {
$('#pop').slideDown(this.apearTime).delay(this.delay).fadeOut(400);;
} else{//call jquery.fixed.js, solving ie6 not supporting fixed
$('#pop').show();
jQuery(function($j){
$j('#pop').positionFixed()
})
}
},
closeDiv:function(){
$("#popClose").click(function(){
$('#pop').hide();
}
);
}
}
In the case of ie6, we call jquery.fixed this plug-in, of course, we have put the plug-in on the bag ads.js download, download the compressed package. The effect of calling this code only needs to write:
var popad=new Pop();
In this way, we can show a lower right corner of the suspension advertising effectiveness, we can continue to expand, (), some of the parameters passed to Pop, can be extended to the website message box and other effects, this left to students who are interested.