js飘窗
广告页上总会出现飘窗效果:
adver_pos_id = getOtherParameter("id");
adver_Sid = getOtherParameter("Sid");
document.write("<div id='fudong01' style='position:absolute;z-index:50000;'><a onClick='setNone(fudong01)' style='position:absolute;right:0px;top:-18px;cursor:pointer;display:block;width:48px;height:16px;font-size: 12px;color:#fff;text-align:center;background:#333;border:1px solid #999;overflow:hidden;font-family:宋体;'>×关闭</a><img src='images/pf.png' border='0' /></div>");
function setNone(str_fd) {
str_fd.style.display = "none";
}
var x = 0,
y = 0
var xin = true,
yin = true
var step = 3
var delay = 100; //设置滚动时间
var obj = document.getElementById("fudong01")
function floatAD() {
var L = 0;
var T = 0;
var cw = document.documentElement.clientWidth || document.body.clientWidth;
var ch = document.documentElement.clientHeight || document.body.clientHeight; //处理浏览器对document.body的兼容问题
var R = (cw - obj.offsetWidth) / 2
var B = ch - obj.offsetHeight;
y++;
var atop = 0;
obj.style.left = x + document.body.scrollLeft + "px";
if (document.documentElement.scrollTop == 0) {
atop = document.body.scrollTop;
} else {
atop = document.documentElement.scrollTop
}
obj.style.top = y + atop + "px"
x = x + step * (xin ? 1 : -1)
if (x < L) {
xin = true;
x = L
}
if (x > R) {
xin = false;
x = R
}
y = y + step * (yin ? 1 : -1)
if (y < T) {
yin = true;
y = T
}
if (y > B) {
yin = false;
y = B
}
}
var itl = setInterval("floatAD()", delay)
obj.onmouseover = function() {
clearInterval(itl)
}
obj.onmouseout = function() {
itl = setInterval("floatAD()", delay)
}
js飘窗的更多相关文章
- 飘窗原生js效果
css: .close { width: 30px; height: 20px; background: white; position: absolute; right: 0; top: 0; z- ...
- JS实现网页飘窗
1.在html中设置一个飘窗的div,div中可以添加图片,添加文字通过css展现在飘窗中: <!--飘窗--> <div id="roll"> <i ...
- 飘窗代码修改了一段js
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 网站飘窗js代码
<SCRIPT> var imagepath="/${res}/images/geren.jpg" ; var imagewidth=178 ;//这两行写图片的大小 ...
- Vue.js 和 MVVM 小细节
MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自 ...
- js学习笔记:操作iframe
iframe可以说是比较老得话题了,而且网上也基本上在说少用iframe,其原因大致为:堵塞页面加载.安全问题.兼容性问题.搜索引擎抓取不到等等,不过相对于这些缺点,iframe的优点更牛,跨域请求. ...
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- JS调用Android、Ios原生控件
在上一篇博客中已经和大家聊了,关于JS与Android.Ios原生控件之间相互通信的详细代码实现,今天我们一起聊一下JS调用Android.Ios通信的相同点和不同点,以便帮助我们在进行混合式开发时, ...
- jquery和Js的区别和基础操作
jqery的语法和js的语法一样,算是把js升级了一下,这两种语法可以一起使用,只不过是用jqery更加方便 一个页面想要使用jqery的话,先要引入一下jqery包,jqery包从网上下一个就可以, ...
随机推荐
- 面向对象多继承(c3算法)、网络基础和编写网络相关的程序
一.面向对象多继承(c3算法) a.有多个父类先找左,再找右,如下示例: class A(object): pass class B(object): def f1(self): print('B') ...
- [Element-UI] 使用Element-UI的DateTimePicker组件报错:Cannot read property 'getHours' of undefined
使用Element-UI组件的DateTimePicker,如下: <template> <div class="block"> <span clas ...
- JAVA实现微信支付V3
喜欢的朋友可以关注下,粉丝也缺. 相信很多的码友在项目中都需要接入微信支付,虽说微信支付已成为一个普遍的现象,但是接入的过程中难免会遇到各种各样的坑,这一点支付宝的SDK就做的很好,已经完成的都知道了 ...
- Composite组合模式(结构型模式)
1.概述 在面向对象系统中,经常会遇到一些具有"容器性质"的对象,它们自己在充当容器的同时,也充当其他对象的容器. 2.案例 需要构建一个容器系统,需要满足以下几点要求: (1). ...
- c++的动态绑定和静态绑定
为了支持c++的多态性,才用了动态绑定和静态绑定. 1.对象的静态类型:对象在声明时采用的类型.是在编译期确定的. 2.对象的动态类型:目前所指对象的声明.在运行期决定.对象的动态类型可以更改,但是静 ...
- c3p0配置文件
配置文件 名称必须为c3p0-config.xml,否则找不到: 标签名称 <c3p0-config> <default-config > 具体配置内容 </defaul ...
- spring-boot-starter-actuator
首先在pom中添加依赖 pom.xml <?xml version="1.0" encoding="UTF-8"?> <project xml ...
- Andrew Ng机器学习课程笔记(三)之正则化
Andrew Ng机器学习课程笔记(三)之正则化 版权声明:本文为博主原创文章,转载请指明转载地址 http://www.cnblogs.com/fydeblog/p/7365475.html 前言 ...
- MySQL Replication 详解MySQL数据库设置主从同步的方法
MySQL同步的流程大致如下: 1.主服务器(master)将变更事件(更新.删除.表结构改变等等)写入二进制日志(master log). 2.从服务器(slave)的IO线程从主服务器(binl ...
- 编码算法-Base64
Base64是一种编码算法,因为这种算法只支持64个[可打印字符],所以叫做Base64. 为了保证所输出的编码位可读字符,Base64制定了一个编码表,以便进行统一转换.编码表的大小为2^6=64, ...