<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title></title>
</head>
<style type="text/css">
*{
    margin:0px;
    padding:0px;
}
    #divbg{
        width:710px;
        height: 339px;
        /*border:1px solid red;*/
        background-image: url("image/scenery.jpg");/*添加背景图片*/
        background-size: 100% 100%;
        position: absolute;
        top:100px;
        left:100px;
    }
</style>
<body>
<div id="divbg"></div>
<script type="text/javascript">
    var divbg=document.getElementById("divbg");//获取div
    var x=0;
//    var y=0;//定义垂直方向初始距离
    var divbgTimer=setInterval(moveBg,100);//设置调用这个方法的定时器，100ms调用一次
    function moveBg(){//背景移动函数
        divbg.style.backgroundPositionX=x+"px";//对div对象的背景图片进行移动
        x=x+2;//向右移动
//        divbg.style.backgroundPositionY=y+"px";
//        y=y+2;//向下移动
    }
</script>
</body>
</html>

html背景自动移动的更多相关文章

  1. [MFC]SDI在图片背景上实现文本跟随鼠标移动

    SDI是单文档接口应用程序的简称.本文要实现的是在视图区域显示一张图片,然后在图片表层显示文字,并且文字跟随鼠标移动.思考一下,可以判断这个问题一共分为以下几个部分:1.显示图片:2.找到鼠标的位置: ...

  2. CSS3 background-image背景图片相关介绍

    这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...

  3. 冒泡，setinterval，背景图的div绑定事件，匿名函数问题

    1.会冒泡到兄弟元素么? $(function(){ $("#a").click(function(){alert("a")}) $("#b" ...

  4. app引导页(背景图片切换加各个页面动画效果)

    前言:不知不觉中又加班到了10点半,整个启动页面做了一天多的时间,一共有三个页面,每个页面都有动画效果,动画效果调试起来麻烦,既要跟ios统一,又要匹配各种不同的手机,然后产品经理还有可能在中途改需求 ...

  5. CSS 3学习——box-sizing和背景

    box-sizing 在CSS 2中设置元素的width和height仅仅是设置了元素内容区的宽和高,元素实际的尺寸是margin + border + padding + 内容区. CSS 3(截止 ...

  6. .NET同步与异步之相关背景知识（六）

    在之前的五篇随笔中,已经介绍了.NET 类库中实现并行的常见方式及其基本用法,当然.这些基本用法远远不能覆盖所有,也只能作为一个引子出现在这里.以下是前五篇随笔的目录: .NET 同步与异步之封装成T ...

  7. Android—ListView条目背景为图片时，条目间距问题解决

    ListView是android开发中使用最普遍的控件了,可有的listView条目的内容颇为丰富,甚至为了美观,背景用指定图片,如下图:

  8. 在rem布局下使用背景图片以及sprite

    现在移动端页面用rem布局已经是一大流派了,成熟的框架如淘宝的flexiable.js,以及我的好友@墨尘写的更轻量级的hotcss.用rem作单位使得元素能够自适应后,还有一块需要关注的,那就是背景 ...

  9. Atitit 动态按钮图片背景颜色与文字组合解决方案

    Atitit 动态按钮图片背景颜色与文字组合解决方案 转换背景颜色,setFont("cywe_img", fontScale, 50, 5) 设置文字大小与坐标 文字分拆,使用字 ...

随机推荐

  1. Use jQuery to hide a DIV when the user clicks outside of it

    http://stackoverflow.com/questions/1403615/use-jquery-to-hide-a-div-when-the-user-clicks-outside-of- ...

  2. 给Oracle锁住的行解锁

    1.找出数据库的serial#,以备杀死: select t2.username,t2.sid,t2.serial#,t2.logon_time from v$locked_object t1,v$s ...

  3. NuMicro Coretex™-M0家族中哪种芯片支持UID (Unique ID)? 用户该怎么做才能对其芯片进行加密功能？

    http://www.nuvoton.com/hq/chs/productfaqs/Pages/00000001.aspx 是的,使用者可利用UID来对以下系列芯片进行加密, Mini51 Serie ...

  4. vimrc常用配置项

    设置行号 set nu 设置自动缩进 set autoindent 设置tab占n个字符 set tabstop=n 设置以空格代替tab(因为有部分场合不允许使用tab) set expandtab ...

  5. IOS 7 Study - UISegmentedControl

    You would like to present a few options to your users from which they can pick anoption, through a U ...

  6. Codeforces Round #310 (Div. 1) A. Case of Matryoshkas 水题

    C. String Manipulation 1.0 Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contes ...

  7. cocos2dx动画Animation介绍

     一.帧动画 你能够通过一系列图片文件,像例如以下这样,创建一个动画: [cpp]   CCAnimation *animation = CCAnimation::create();   //从本 ...

  8. JS的加载方式---同步和异步

    同步加载及异步加载,只有这两种方式. 动态加载是异步加载的方式之一. ajax加载也是异步加载.

  9. Java 完美判断中文字符的方法

    Java判断一个字符串是否有中文一般情况是利用Unicode编码(CJK统一汉字的编码区间:0x4e00–0x9fbb)的正则来做判断,但是其实这个区间来判断中文不是非常精确,因为有些中文的标点符号比 ...

  10. C++ Socket超时设置

    用winsocket时,send(),recv()过程中有时由于网络状况等原因,收发不能预期进行,可以设置收发时限:int nNetTimeout = 1000; //1秒//发送时限setsocko ...