html手机广告倒计时弹屏6

本文实例讲述了实现可关闭的倒计时广告特效代码。分享给大家供大家参考。具体如下：

这是一款类似播放视频时候最开始的倒计时广告，广告时间结束才能看到视频内容，一个JS小贴片广告代码，右上角带关闭按钮，左上角显示倒计时剩余时间，运行代码综合实现，CSS和HTML共同结合的网页特效，兼容各主流浏览器，本效果是从门户网站上整理而来。希望大家喜欢。

先来看看运行效果截图：

在线演示地址如下：

--time-adv--

具体代码如下：

!

html

head

=GBK""titlejs贴片倒计时代码/titlestyle*{padding:0;margin:0;font-size:12px;}ol,ul,li{list-style:none}img{border:none}.Box{width:564px;height:361px;margin:20pxauto;position:relative;display:none;}.ad_time{width:554px;height:351px;background:#000;filter:alpha(opacity=50);-moz-opacity:0.5;opacity:0.5;padding:5px;position:absolute;top:0;left:0;color:#fff;}.ad_timespan{font-weight:bold;color:#cc0;padding:05px;}.close{width:49px;height:20px;background:url(images/close.png)no-repeat;position:absolute;top:0;right:0;cursor:pointer;}.btn{width:100px;height:30px;background:#eee;border:1pxsolid#ddd;font:normal12px/30px'寰蒋榛';text-align:center;margin:20pxauto;cursor:pointer;}/stylescripttype="text/javascript"src="jquery-1.6.2.min.js"language="javascript"/scriptscripttype="text/javascript"language="javascript"functionlxfEndtime(){$t=$('#t').html();if($t!=0){$('#t').html($t-1);$i=setTimeout("lxfEndtime()",1000);}else{$('.Box').hide();$('.btn').show();$('#t').html(6);$('.ad_time').css({'width':'554px','height':'351px'});clearTimeout($i);}};$(document).ready(function(){$('.btn').live('click',function(){$('.Box').show();$(this).hide();$('.ad_time').animate({width:110,height:18},'slow');lxfEndtime();})$('.close').click(function(){$('.Box').hide();$('.btn').show();$('#t').html(6);$('.ad_time').css({'width':'554px','height':'351px'});clearTimeout($i);})});/script/headbody!--代码开始--divclass="Box"divclass="ad"ahref="#"target="_blank"imgsrc="images/ad.jpg"//a/divdivclass="ad_time"时间还剩spanid="t"50/span秒/divdivclass="close"/div/divdivclass="btn"点击显示效果/div!--html手机广告倒计时弹屏6代码结束--/body/html

希望本文所述对大家的jquery程序设计有所帮助。

总结

以上是编程之家为你收集整理的jquery实现可关闭的倒计时广告特效代码全部内容，希望文章能够帮你解决jquery实现可关闭的倒计时广告特效代码所遇到的程序开发问题。

如果觉得编程之家网站内容还不错，欢迎将编程之家网站推荐给程序员好友。

标签：html手机广告倒计时弹屏6