基于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 相关文章推荐
用js实现输入提示(自动完成)的实例代码
Jun 14 Javascript
js的延迟执行问题分析
Jun 23 Javascript
浅谈Javascript实现继承的方法
Jul 06 Javascript
jQuery AJAX timeout 超时问题详解
Jun 21 Javascript
codeMirror插件使用讲解
Jan 16 Javascript
JavaScript获取tr td 的三种方式全面总结(推荐)
Aug 15 Javascript
聊聊那些使用前端Javascript实现的机器学习类库
Sep 18 Javascript
封装运动框架实战左右与上下滑动的焦点轮播图(实例)
Oct 17 Javascript
mpvue性能优化实战技巧(小结)
Apr 17 Javascript
JavaScript中的null和undefined用法解析
Sep 30 Javascript
如何基于js判断浏览器版本
Feb 20 Javascript
详解Howler.js Web音频播放终极解决方案
Aug 23 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
javascript 回到顶部效果的实现代码
2014/02/17 Javascript
javascript校验价格合法性实例(必须输入2位小数)
2014/05/05 Javascript
chrome不支持form.submit的解决方案
2015/04/28 Javascript
原生js实现图片放大缩小计时器效果
2017/01/20 Javascript
图片上传之FileAPI与NodeJs
2017/01/24 NodeJs
Bootstrap实现的表格合并单元格示例
2018/02/06 Javascript
node.js通过axios实现网络请求的方法
2018/03/05 Javascript
vue 实现element-ui中的加载中状态
2020/11/11 Javascript
python操作redis的方法
2015/07/07 Python
django模型层(model)进行建表、查询与删除的基础教程
2017/11/21 Python
PyQt5每天必学之创建窗口居中效果
2018/04/19 Python
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
Python给图像添加噪声具体操作
2019/03/03 Python
pandas的连接函数concat()函数的具体使用方法
2019/07/09 Python
python 动态迁移solr数据过程解析
2019/09/04 Python
wxPython实现列表增删改查功能
2019/11/19 Python
python圣诞树编写实例详解
2020/02/13 Python
使用jupyter notebook将文件保存为Markdown,HTML等文件格式
2020/04/14 Python
python三引号如何输入
2020/07/06 Python
详解Python3 定义一个跨越多行的字符串的多种方法
2020/09/06 Python
对Pytorch 中的contiguous理解说明
2021/03/03 Python
医疗保健专业人士购物网站:Scrubs & Beyond
2017/02/08 全球购物
西班牙土拨鼠床垫公司,感觉在云端:Marmota
2019/03/18 全球购物
日本即尚网:JSHOPPERS.com(支持中文)
2019/12/03 全球购物
公务员的自我鉴定
2013/10/26 职场文书
食品安全工作实施方案
2014/03/26 职场文书
民族学专业大学生职业规划范文:清晰未来的构想
2014/09/20 职场文书
单方离婚协议书范本2014
2014/10/28 职场文书
学生党员检讨书范文
2014/12/27 职场文书
学雷锋日活动总结
2015/02/06 职场文书
财务统计员岗位职责
2015/04/14 职场文书
2015年环卫工作总结
2015/04/28 职场文书
重温入党誓词主持词
2015/06/29 职场文书
2015年高中班级工作总结
2015/07/21 职场文书
Vue组件更新数据v-model不生效的解决
2022/04/02 Vue.js
MySQL 原理与优化之Update 优化
2022/08/14 MySQL