基于jquery实现的定时显示与隐藏div广告的实现代码


Posted in Javascript onAugust 22, 2013

下面我给大家分享我的方法:

在jquery中要显示与隐藏层是很简单的直接使用hide与show方法就可以了,但要定时我们需要利用setTimeout函数来实例,下面我给大家分享我的方法。
html页面中我们随便放些东西

<div class="toolbarframe" style="display:none;"><a href="https://3water.com" target="_blank"><img src="/upfile/swf/s.jpg" /></a><a class="bigad_close">关闭</a></div>

jquery代码

<script src="/js/jquery-1.7.2.min.js" language="javascript" type="text/javascript"></script>
<script>
$(function(){ 
setTimeout('$(".toolbarframe").show("slow")',3000);
 setTimeout('$(".toolbarframe").hide("slow")',13000);
  $(".bigad_close").click(function(){
 $(".toolbarframe").hide("slow");
})
});
</script>

简单介绍下上面的核心实现代码:

setTimeout('$(".toolbarframe").show("slow")',3000); 过三秒div慢慢从小到大显示出来
setTimeout('$(".toolbarframe").hide("slow")',13000); 过十秒再自动把div从大到小隐藏了
$(".bigad_close").click(function(){
 $(".toolbarframe").hide("slow");
})

这个是用户来关闭,点击关闭就可以实现关闭这个层了。

Javascript 相关文章推荐
使javascript也能包含文件
Oct 26 Javascript
function, new function, new Function之间的区别
Mar 08 Javascript
Extjs学习笔记之四 工具栏和菜单
Jan 07 Javascript
jQuery实现跟随鼠标运动图层效果的方法
Feb 02 Javascript
JavaScript中创建字典对象(dictionary)实例
Mar 31 Javascript
JS显示下拉列表框内全部元素的方法
Mar 31 Javascript
正则验证小数点后面只能有两位数的方法
Feb 28 Javascript
纯js实现的积木(div层)拖动功能示例
Jul 19 Javascript
详解微信小程序中组件通讯
Oct 30 Javascript
JS 5种遍历对象的方式
Jun 16 Javascript
jQuery实现图片切换效果
Oct 19 jQuery
解决vue props传Array/Object类型值,子组件报错的情况
Nov 07 Javascript
仿百度输入框智能提示的js代码
Aug 22 #Javascript
JAVASCRIPT函数作用域和提前声明 分享
Aug 22 #Javascript
JavaScript中的eval()函数详解
Aug 22 #Javascript
from 表单提交返回值用post或者是get方法实现
Aug 21 #Javascript
jquery重新播放css动画所遇问题解决
Aug 21 #Javascript
JS性能优化笔记搜索整理
Aug 21 #Javascript
JS检测图片大小的实例
Aug 21 #Javascript
You might like
一个简单的php实现的MySQL数据浏览器
2007/03/11 PHP
thinkphp中session和cookie无效的解决方法
2014/12/19 PHP
PHP中对数组的一些常用的增、删、插操作函数总结
2015/11/27 PHP
功能强大的PHP POST提交数据类
2016/07/15 PHP
基于jquery的web页面日期格式化插件
2011/11/15 Javascript
浅谈javascript中for in 和 for each in的区别
2015/04/23 Javascript
javaScript实现滚动新闻的方法
2015/07/30 Javascript
Jquery Mobile 自定义按钮图标
2015/11/18 Javascript
JS在一定时间内跳转页面及各种刷新页面的实现方法
2016/05/26 Javascript
jQuery解析与处理服务器端返回xml格式数据的方法详解
2016/07/04 Javascript
浅析JavaScript中的array数组类型系统
2016/07/18 Javascript
浅析JavaScriptSerializer类的序列化与反序列化
2016/11/22 Javascript
js调用刷新界面的几种方式
2017/05/03 Javascript
jQuery使用JSONP实现跨域获取数据的三种方法详解
2017/05/04 jQuery
微信小程序 同步请求授权的详解
2017/08/04 Javascript
开源一个微信小程序仪表盘组件过程解析
2019/07/30 Javascript
Node 模块原理与用法详解
2020/05/13 Javascript
Python里disconnect UDP套接字的方法
2015/04/23 Python
Django csrf 两种方法设置form的实例
2019/02/03 Python
Python实现隐马尔可夫模型的前向后向算法的示例代码
2019/12/31 Python
python下载卫星云图合成gif的方法示例
2020/02/18 Python
利用python控制Autocad:pyautocad方式
2020/06/01 Python
Python中flatten( ),matrix.A用法说明
2020/07/05 Python
Python 的 f-string 可以连接字符串与数字的原因解析
2021/02/20 Python
深入理解HTML5定时器requestAnimationFrame的使用
2018/12/12 HTML / CSS
MCAKE蛋糕官方网站:一直都是巴黎的味道
2018/02/06 全球购物
德国拖鞋网站:German Slippers
2019/11/08 全球购物
艺术节主持词
2014/04/02 职场文书
效能风暴心得体会
2014/09/04 职场文书
群众对十八届四中全会的期盼
2014/10/17 职场文书
大学开学感言
2015/08/01 职场文书
煤矿安全生产工作总结
2015/08/13 职场文书
2019最新公司租房合同(例文)
2019/07/18 职场文书
Python包argparse模块常用方法
2021/06/04 Python
详解非极大值抑制算法之Python实现
2021/06/28 Python
Win11 21h2可以升级22h2吗?看看你的电脑符不符合要求
2022/07/07 数码科技