当前位置:网站首页 > 图文广告 > 正文

html手机广告倒计时弹屏6

作者:admin发布时间:2024-07-10分类:图文广告浏览:评论:26


导读:本文实例讲述了实现可关闭的倒计时广告特效代码。分享给大家供大家参考。具体如下:这是一款类似播放视频时候最开始的倒计时广告,广告时间结束才能看到视频内容,一个JS小贴片广告代码,右上...

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


已有26位网友发表了看法:

欢迎 发表评论: