window.onload=function(){
//广告滚动
var oneInner = $('#divid')[0];
//定时器
var a1a = setInterval(moves,10);
//函数
var x = 1;
var y = 1;
function moves(){
var tops = oneInner.offsetTop
var lefts = oneInner.offsetLeft if (lefts>=document.documentElement.clientWidth-oneInner.offsetWidth||lefts<0)
{
x = -x;
} if (tops>=(document.documentElement.clientHeight+document.documentElement.scrollTop)-oneInner.offsetHeight)
{
y = -1;
}
if (tops<=document.documentElement.scrollTop){
y = 1;
} tops+=y;
lefts+=x; oneInner.style.top=tops+"px"
oneInner.style.left=lefts+"px"
}
//悬停停止
oneInner.onmouseover=function(){
clearInterval(a1a);
}
//放手继续运动
oneInner.onmouseout=function(){
a1a =setInterval(moves,10);
}
}

css广告弹窗满屏跑的更多相关文章

  1. CSS div 高度满屏

    方法一: 通过JQuery,获取窗体的高度,设置给对应的div.代码如下 ht = $(document.body).height(); $(); 缺点:由于浏览器是先解析css,后执行JS,导致页面 ...

  2. css 让内容满屏居中不变形

    .selector { position: fixed; width: 100%; height: 100%; background-image: url(path); background-repe ...

  3. css背景图片拉伸 以及100% 满屏显示

    如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...

  4. 利用snowfall.jquery.js实现爱心满屏飞

    小颖在上一篇一步一步教你用CSS画爱心中已经分享一种画爱心的方法,这次再分享一种方法用css画爱心,并利用snowfall.jquery.js实现爱心满屏飞的效果. 第一步: 利用伪元素before和 ...

  5. js广告弹窗

    生活中我们经常遇到一些烦人的广告页面,比方说弹窗,悬浮等等各种广告.有的同事甚至都下一个屏蔽广告插件到浏览器上.这样就防止了广告的干扰. 但是我们学前端的必须是要知道广告弹窗这个做的过程,甚至是它的原 ...

  6. 原生JS实现各种经典网页特效——Banner图滚动、选项卡切换、广告弹窗等

    在制作网页过程中,我们可能会遇到各种常用的经典网页特效,比如Banner图片滚动.选项卡循环播放.右下角广告弹窗.评论提交展示.选项动态增删.剪刀石头布小游戏等等等...是不是感觉都见到过这些场景.那 ...

  7. Android简易实战教程--第四十九话《满屏拖动的控件》

    今天做个有意思的效果吧,控件的拖拽,简单实用,逻辑清晰点3分钟看完. 说的很高大上,其实就是拖动Button按钮跟着鼠标位置满手机屏幕跑罢了. 直接上简单的代码吧: public class Main ...

  8. jQuery实现广告弹窗

    首先设置一个固定的窗口位于右下角,效果如下: 代码: jQuery实现广告弹窗.html 之后将该窗口初始设为隐藏,通过代码实现3秒自动显示,5秒自动隐藏,其效果如下: <!DOCTYPE ht ...

  9. Easyui layout设置满屏效果

    html文件: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" ...

随机推荐

  1. 「NetworkOnMainThreadException」:Android 2.3到Android 4.0上传文件的问题

    我在百度知道上的提问: 『之前我用的一段文件上传的代码,配合服务器端的servlet,实现了上传手机上的文件的功能:但是后来我把手机的Android系统从2.3升级到了4.0 ,同样的代码,同样的配置 ...

  2. MultiAutoCompleteTextView

    Activity_mian.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android&qu ...

  3. poj1830开关问题——异或高斯消元

    题目:http://poj.org/problem?id=1830 根据题意,构造出n元方程组: a(1,1)x1 ^ a(1,2)x2 ^ a(1,3)x3 ... a(1,n)xn = st1 ^ ...

  4. kubernetes1.13.1部署ingress-nginx-十一

    一.Ingress 简介 (1) 在Kubernetes中,服务和Pod的IP地址仅可以在集群网络内部使用,对于集群外的应用是不可见的. 为了使外部的应用能够访问集群内的服务, 在Kubernetes ...

  5. 任务39:Role以及Claims授权

    基于Role角色的授权 asp.net core在逐渐淘汰这种基于RoleBase的基于角色的授权.鼓励大家使用基于Claim的授权 在认证的时候Cliam已经加入了Role 注释38节课的 自定义验 ...

  6. NOJ2026:Keroro侵略地球(01字典树)

    传送门 题意 略 分析 将n个数插入字典树中,m次查询,取最大值,复杂度\(O(mlogn)\) trick 1.注意题目给的空间,开40刚刚够(62852K) 2.作为01字典树的模板保存了 代码 ...

  7. 了解Hypertable

    1.为什么要了解Hypertable, 因为全球最大的搜索引擎公司百度使用了Hypertable(http://www.baidu.com/s?wd=Hypertable),Hypertable类似于 ...

  8. Python解释器的安装步骤

    Python是一门强大的语言,目前已支持所有主流操作系统,在Linux,Unix,Mac系统上自带Python环境,在Windows10系统上需要安装一下,超简单 1.  打开官网 https://w ...

  9. javascript E5面向对象和 E6面向对象

    javascript es6之前的面向对象方法: 一般使用构造函数来实现 function Person (name, age) { this.name = name; this.age = age; ...

  10. LuoguP2320/CF1037A 用二进制表示数的奥妙重重方法 By cellur925

    题目描述 鬼谷子非常聪明,正因为这样,他非常繁忙,经常有各诸侯车的特派员前来向他咨询时政. 有一天,他在咸阳游历的时候,朋友告诉他在咸阳最大的拍卖行(聚宝商行)将要举行一场拍卖会,其中有一件宝物引起了 ...