仿中关村在线首页弹出式广告插件(jQuery版)

其的就不多说啦，直接上代码：

jquery 插件：

/*
疯狂秀才 制作 于 2012-04-24 17:00 
QQ: 1055818239
email: hxl_apple@163.com

*/
(function($){
	$.fn.quickAd = function(settings){
		settings = $.extend({
			width:760, 
			height:400,
			html:'我是广告内容',
			top:130,
			sec:5, //广告显示时长，单位秒
			border:true //显示外框
		},settings);
		var fkxc_ad = 0;
		var bodyWidth = $(window).width();
		var _adBodyContainerID = "bigAd_"+settings.width;
		var _adCloseContainerID = "bitAdClose_"+settings.width;
		var closeHtml = '广告剩余 <span id="__sec"></span> 秒    <a href="javascript:;" id="__close_ad">关 闭</a>';
		//广告内容容器
		var _adContent = '<div id="'+_adBodyContainerID+'"></div>';
		//关闭按钮容器
		var _adCloseBtn = '<div id="'+_adCloseContainerID+'">'+closeHtml+'</div>';
		var self = $(this);
		$(this).empty().html(_adContent+_adCloseBtn);
		
		$('#__close_ad').click(function(){
			window.clearTimeout(fkxc_ad);
			self.fadeOut();
		})
		
		if(settings.border){
			$('#'+_adBodyContainerID).css('border','1px solid #ccc');
		}
		
		$('#'+_adBodyContainerID).empty().html(settings.html).css({
			'width':settings.width+'px',
			'height':settings.height+'px',
			'position': 'fixed',
			'z-index': 20000,
			'top':settings.top+'px',
			'left':(bodyWidth - settings.width) / 2 + 'px'
		}).fadeIn('fast');
		
		$('#'+_adCloseContainerID).css({
			'width':'160px','height':'18px','line-height':'18px','background-color':'#ccc',
			'text-align': 'center', 'opacity': '0.8','top':settings.top+'px','position': 'fixed',
			'left':((bodyWidth - settings.width) / 2+(settings.width-160)) + 'px', 'z-index': 20001
		}).show();
		
		var daojishi = function (s) {
            fkxc_ad = setInterval(function () {
                if (s == 0) {
                    self.fadeOut();
                }
                $("#__sec").text(s);
                s--;
            }, 1000);
        }
		
		daojishi(settings.sec)
	}
})(jQuery)

　　

HTML:

<div id="testad"></div>

  <script>
  $(function(){
	$('#testad').quickAd({
		html:'<img src="11_523049_88a5614dc705882 (1).jpg" width=760 height=400 />'
	});
  })
  </script>

 

Ok啦！

附效果图一张：