基于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的一种模块模式
Mar 22 Javascript
js innerHTML 的一些问题的解决方法
Jun 22 Javascript
js 判断浏览器类型 去全角、半角空格 自动关闭当前窗口
Apr 10 Javascript
根据经纬度计算地球上两点之间的距离js实现代码
Mar 05 Javascript
jquery实现网页查找功能示例分享
Feb 12 Javascript
浅谈被jQuery抛弃的函数及替代函数
May 03 Javascript
JavaScript中的getTimezoneOffset()方法使用详解
Jun 10 Javascript
JavaScript实现斗地主游戏的思路
Feb 29 Javascript
JavaScript编写一个贪吃蛇游戏
Mar 09 Javascript
详解vue中this.$emit()的返回值是什么
Apr 07 Javascript
微信小程序全局变量改变监听的实现方法
Jul 15 Javascript
基于vuex实现购物车功能
Jan 10 Vue.js
仿百度输入框智能提示的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中通过ADO调用Access数据库的方法测试不通过
2006/12/31 PHP
很让人受教的 提高php代码质量36计
2012/09/05 PHP
php实现的发送带附件邮件类实例
2014/09/22 PHP
配置php.ini实现PHP文件上传功能
2014/11/27 PHP
php根据日期显示所在星座的方法
2015/07/13 PHP
php中文语义分析实现方法示例
2019/09/28 PHP
php的无刷新操作实现方法分析
2020/02/28 PHP
Ext面向对象开发实践(续)
2008/11/18 Javascript
简单的jquery拖拽排序效果实现代码
2011/09/20 Javascript
js实现双向链表互联网机顶盒实战应用实现
2011/10/28 Javascript
javascript实现复制与粘贴操作实例
2014/10/16 Javascript
javascript自定义右键弹出菜单实现方法
2015/05/25 Javascript
使用jquery.qrcode.min.js实现中文转化二维码
2016/03/11 Javascript
避免jQuery名字冲突 noConflict()方法
2016/07/30 Javascript
js基本算法:冒泡排序,二分查找的简单实例
2016/10/08 Javascript
easyui取消表单实时验证,提交时统一验证的简单实例
2016/11/07 Javascript
Angular在一个页面中使用两个ng-app的方法(二)
2017/02/20 Javascript
深入对Vue.js $watch方法的理解
2017/03/20 Javascript
JavaScript中join()、splice()、slice()和split()函数用法示例
2018/08/24 Javascript
js比较两个单独的数组或对象是否相等的实例代码
2019/04/28 Javascript
浅谈layer的Icon样式以及一些常用的layer窗口使用方法
2019/09/11 Javascript
基于vue-simple-uploader封装文件分片上传、秒传及断点续传的全局上传插件功能
2021/02/23 Vue.js
python机器学习理论与实战(一)K近邻法
2021/01/28 Python
Python3.5.3下配置opencv3.2.0的操作方法
2018/04/02 Python
Python3连接SQLServer、Oracle、MySql的方法
2018/06/28 Python
Python骚操作之动态定义函数
2019/03/26 Python
使用python 写一个静态服务(实战)
2019/06/28 Python
解决windows下python3使用multiprocessing.Pool出现的问题
2020/04/08 Python
Pycharm常用快捷键总结及配置方法
2020/11/14 Python
Noon埃及:埃及在线购物
2019/11/26 全球购物
新闻网站实习自我鉴定
2013/09/25 职场文书
公务员保密承诺书
2014/03/27 职场文书
小学学校门卫岗位职责
2014/08/03 职场文书
乡镇党委书记第三阶段个人整改措施
2014/09/16 职场文书
公文写作:新员工转正申请书范本3篇!
2019/08/07 职场文书
python scipy 稀疏矩阵的使用说明
2021/05/26 Python