js 居中漂浮广告_Javascript

程序源码

程序原理
整个广告运行具有四步动作.
1. 初始化时隐藏于页面最底部.
2. 自底向上升起.直到整个广告漂浮出来
3. 启动检测.滚动时保持广告始终处于页面中间最底部.
4. 到达自定义间隔时间.广告自动渐隐.
整个实现最重要的就是控制广告距离文档(非窗口)最顶部的距离.(scrolltop + browser.clientheight).这里提供了获取这几个值的代码.
获取scrolltop, scrollleft
注意chrome和safari即使在标准doc模式下的根文档也是document.body而不是document.documentelement

获取可视窗口的宽高

代码思路流程
初始化(init) -----> 设置居中并隐藏底部(setcenter) -----> 渐显(fadein) -----> 渐显完毕.调用回调函数_callback ----->
开始倒计时渐隐时间(settimeout(fadeout, time)), 并绑定实时检测函数(scroll) -----> 到达自定义时间隐藏广告(fadeout)
使用说明
实例化函数.传入广告容器id.设置默认属性.
默认属性有:

这里为了演示方便.所以当点击按钮时候才初始化广告.也可以在window.onload的时候就载入广告.
演示下载地址