JS实现简单的顶部定时关闭层效果


Posted in Javascript onJune 15, 2014
<script type="text/javascript"> 
var time = 300; 
var h = 0; 
function addCount() 
{ 
if(time>0) 
{ 
time--; 
h = h+5; 
} 
else 
{ 
return; 
} 
if(h>300) //高度 
{ 
return; 
} 
document.getElementById("ads").style.display = ""; 
document.getElementById("ads").style.height = h+"px"; 
setTimeout("addCount()",30); 
} 
window.onload = function showAds() 
{ 
addCount(); 
setTimeout("noneAds()",7000); //停留时间自己调了 
} 
var T = 300; 
var N = 300; //高度 
function noneAds() 
{ 
if(T>0) 
{ 
T--; 
N = N-5; 
} 
else 
{ 
return; 
} 
if(N<0) 
{ 
document.getElementById("ads").style.display = "none"; 
return; 
} 
document.getElementById("ads").style.height = N+"px"; 
setTimeout("noneAds()",30); 
} 
</script>

<div style="MARGIN: 0px auto; WIDTH: 900px; BACKGROUND: #369; HEIGHT: 300px; COLOR: #fff" id="ads">三水点靠木_3water.com</div>
Javascript 相关文章推荐
关于jQuery UI 使用心得及技巧
Oct 10 Javascript
JS文本框追加多个下拉框的值的简单实例
Jul 12 Javascript
json数据的列循环示例
Sep 06 Javascript
jquery获取tr并更改tr内容示例代码
Feb 13 Javascript
javascript中style.left和offsetLeft的用法说明
Mar 07 Javascript
Angular中$cacheFactory的作用和用法实例详解
Aug 19 Javascript
如何在Angular2中使用jQuery及其插件的方法
Feb 09 Javascript
详解vue-cli 3.0 build包太大导致首屏过长的解决方案
Nov 10 Javascript
layui监听工具栏的实例(操作列表按钮)
Sep 10 Javascript
解决LayUI数据表格复选框不居中显示的问题
Sep 25 Javascript
vue中实现回车键登录功能
Feb 19 Javascript
Element-ui树形控件el-tree自定义增删改和局部刷新及懒加载操作
Aug 31 Javascript
jQuery中的height innerHeight outerHeight区别示例介绍
Jun 15 #Javascript
鼠标移到图片上变大显示而不是放大镜效果
Jun 15 #Javascript
js中的如何定位固定层的位置
Jun 15 #Javascript
Extjs Label的 fieldLabel和html属性值对齐的方法
Jun 15 #Javascript
jquery实现通用版鼠标经过淡入淡出效果
Jun 15 #Javascript
jQuery实现的原图对比窗帘效果
Jun 15 #Javascript
QQ空间顶部折页撕开效果示例代码
Jun 15 #Javascript
You might like
图片存储与浏览一例(Linux+Apache+PHP+MySQL)
2006/10/09 PHP
PHP 读取大文件的X行到Y行内容的实现代码
2013/06/24 PHP
PHP按行读取文件时删除换行符的3种方法
2014/05/04 PHP
详解PHP的Yii框架中日志的相关配置及使用
2015/12/08 PHP
详解Laravel5.6 Passport实现Api接口认证
2018/07/27 PHP
Yii框架小部件(Widgets)用法实例详解
2020/05/15 PHP
繁简字转换功能
2006/07/19 Javascript
jQuery 性能优化指南 (1)
2009/05/21 Javascript
JavaScript中的6种运算符总结
2014/10/16 Javascript
js实现同一个页面多个渐变效果的方法
2015/04/10 Javascript
javascript引用类型指针的工作方式
2015/04/13 Javascript
JS+CSS实现另类带提示效果的竖向导航菜单
2015/10/15 Javascript
jQuery语法小结(超实用)
2015/12/31 Javascript
JS简单生成两个数字之间随机数的方法
2016/08/03 Javascript
基于Bootstrap的标签页组件及bootstrap-tab使用说明
2017/07/25 Javascript
vue2.0 根据状态值进行样式的改变展示方法
2018/03/13 Javascript
Vue路由模块化配置的完整步骤
2019/08/14 Javascript
微信小程序吸底区域适配iPhoneX的实现
2020/04/09 Javascript
JS 图片压缩原理与实现方法详解
2020/04/29 Javascript
基于canvasJS在PHP中制作动态图表
2020/05/30 Javascript
python基础教程之Hello World!
2014/08/29 Python
Python使用QRCode模块生成二维码实例详解
2017/06/14 Python
python生成器,可迭代对象,迭代器区别和联系
2018/02/04 Python
python通过txt文件批量安装依赖包的实现步骤
2019/08/13 Python
Python3安装pip工具的详细步骤
2019/10/14 Python
Python爬虫设置ip代理过程解析
2020/07/20 Python
改变 Python 中线程执行顺序的方法
2020/09/24 Python
Python远程linux执行命令实现
2020/11/11 Python
html5启动原生APP总结
2020/07/03 HTML / CSS
《桂花雨》教学反思
2014/04/12 职场文书
机械加工与数控专业自荐书
2014/06/04 职场文书
销售人员求职信
2014/07/22 职场文书
我爱我班主题班会
2015/08/13 职场文书
2015年国庆节寄语
2015/08/17 职场文书
医生行业员工的辞职信
2019/06/24 职场文书
简单聊聊TypeScript只读修饰符
2022/04/06 Javascript