<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>我是广告</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">

</head>
<body>
<div id="one" style="background:green;position:absolute;left:0;top:0;width:100px;height:100px;">我是广告我怕谁</div>
</body>

<script>
    
    var x=0;
    var y=0;

    var xs=10;
    var ys=10;

    var one=document.getElementById("one");
    function move()
    {
            x+=xs;
            y+=ys;
            if(x >= document.body.clientWidth-one.offsetWidth-20|| x <=0 ){
                xs=-1*xs;
            }
            //这里注意document.body.clientHeight是html 跟  document.documentElement.clientHeight是xml html5  的区别
            if(y >= document.documentElement.clientHeight-one.offsetHeight-20 || y <=0)
            {
                ys=-1*ys;
            }
            one.style.left=x+"px";
            one.style.top=y+"px";    
    }
    
    var dt=setInterval("move()",100);
    one.onmouseover=function()
    {
        clearInterval(dt);
    }

    one.onmouseout=function()
    {
        dt=setInterval("move()", 100);    
    }

</script>

</html>

javascript 我是广告的更多相关文章

  1. JavaScript浮动广告代码，容纯DIV/CSS对联漂浮广告代码，兼容性非常好的js右下角与漂浮广告代码

    基于JavaScript代码实现随机漂浮图片广告,javascript图片广告 在网上有很多这样的代码,不过未必符合W3C标准,因为在头部加上<!DOCTYPE html>类似标签之后,漂 ...

  2. Javascript设置广告和时间表和数组的学习

    <html> <head> <meta charset="utf-8"> <title></title> </he ...

  3. 杨校老师课堂之JavaScript右下角广告弹框教程

    案例制作思路: 1.先制作界面 添加一个盒子包含一个按钮,使盒子绝对定位在右上角 添加一个大盒子,同理,将盒子居于左下角:其中内部包含一个顶端盒子和底部盒子 顶端盒子因为是属于大盒子内部的存在,所以宽 ...

  4. [转]javascript对联广告、漂浮广告封装类，多浏览器兼容

    封装的JS方法: function $$(element){ if(arguments.length>1){ for(var i=0,elements=[],length=arguments.l ...

  5. 自制Javascript浮动广告

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb ...

  6. JavaScript 图片广告自动与手动的切换

    ​1.代码 <html> <head>   <script type="text/javascript" src="jquery-1.8.j ...

  7. JavaScript动态广告弹出框

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. JS全屏漂浮广告、移入光标停止移动

    点击这里查看效果 以下是代码: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Ty ...

  9. 深入理解JavaScript系列（1）：编写高质量JavaScript代码的基本要点

    深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点 2011-12-28 23:00 by 汤姆大叔, 139489 阅读, 119 评论, 收藏, 编辑 才华横溢的 ...

随机推荐

  1. PHP设计模式笔记九：装饰器模式 -- Rango韩老师 http://www.imooc.com/learn/236

    装饰器模式(Decorator) 概述 1.装饰器模式可以动态地添加修改类的功能 2.一个类提供了一项功能,如果要在修改并添加额外的功能,传统的编程模式,需要写一个子类继承它,并重新实现类的方法 3. ...

  2. [RxJS] Sharing Streams with Share

    A stream will run with each new subscription added to it. This lesson shows the benefits of using sh ...

  3. rsync+sersync实现数据文件实时同步

    一.简介 sersync是基于Inotify开发的,类似于Inotify-tools的工具: sersync可以记录下被监听目录中发生变化的(包括增加.删除.修改)具体某一个文件或某一个目录的名字: ...

  4. oracle to_char()及to_date()函数使用

    to_char(x[,format]) :将x转换成字符串,可以使用format参数来格式化字符串输出. to_date(x[,format]) :将字符串x转换成日期,可以使用format匹配要转换 ...

  5. 全世界最详细的图形化VMware中linux环境下oracle安装（一）【weber出品必属精品】

    安装流程:前期准备工作--->安装ORACLE软件--->安装升级补丁--->安装odbc创建数据库--->安装监听器--->安装EM <前期准备工作> 安装 ...

  6. Invalid content was found starting with element 'taglib'”

    今天在使用struts-menu制作菜单,在web.xml中写入 <taglib>      <taglib-uri>/WEB-INF/struts-menu.tld</ ...

  7. UILabel 的使用，属性详解

    ·UILable是iPhone界面最基本的控件,主要用来显示文本信息. ·常用属性和方法有: .创建 CGRect rect = CGRectMake(, , , ); UILabel *label ...

  8. 选中CheckBoxList的值放到TextBox中，再次选中从textBox中删除

    当选中checkboxlist中的值,直接放到文本框中,在checkboxlist的SelectedIndexChanged事件下执行方法, //将选中的值放到文本框中                ...

  9. js处理数学经典问题：有一对兔子，从出生后第3个月起每个月都生一对兔子，小兔子长到第三个月后每个月又生一 对兔子，假如兔子都不死，问每个月的兔子总数为多少？

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  10. <转> 纸牌屋1-4集分析

    原文:http://blog.sina.com.cn/s/blog_b86c61490102v56t.html 第一季第一集 主人公弗兰克的出场,是以对待一只邻家将死之狗的态度展开的,充分显示了主人公 ...