编程 Javascript

JS实现往下不断流动网页背景的方法

Posted in Javascript onFebruary 27, 2015

本文实例讲述了JS实现往下不断流动网页背景的方法。分享给大家供大家参考。具体实现方法如下：

<html>

<head>

<title>JS实现的往下不断流动的网页背景</title>

</head>

<body background="/images/bg002.jpg">

<script language="JavaScript">

<!-- Begin

var backgroundOffset = 0;    //背景图片的偏移量

var bgObject = eval('document.body');    //得到文挡本身的对象

function scrollBG(maxSize) {    //这个函数就是滚动背景的核心

backgroundOffset = backgroundOffset + 1;   //将背景偏移加1点

if (backgroundOffset > maxSize) backgroundOffset = 0;  //如果偏移量超过了最大值则回零

bgObject.style.backgroundPosition = "0 " + backgroundOffset; //设定背景的偏移量，使其生效

}

var ScrollTimer = window.setInterval("scrollBG(307)", 64); //设定每次移动背景之间的间隔。

// End -->

</script>

<div style="position: absolute; top: 200; left:300;">

  <table border="0" width="100%" cellspacing="0" cellpadding="0">

    <tr>

      <td width="100%"><b>流动的背景是不是很漂亮？</b></td>

    </tr>

  </table>

</div>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

JS实现往下不断流动网页背景的方法

- Author -

代码家园

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

学习ExtJS（一）之基础前提

Oct 07 Javascript

加载远程图片时,经常因为缓存而得不到更新的解决方法(分享)

Jun 26 Javascript

js点击出现悬浮窗效果不使用JQuery插件

Jan 20 Javascript

JSON与XML优缺点对比分析

Jul 17 Javascript

正则表达式(语法篇推荐)

Jun 24 Javascript

基于JS快速实现导航下拉菜单动画效果附源码下载

Oct 27 Javascript

深入解析Vue 组件命名那些事

Jul 18 Javascript

React Native使用fetch实现图片上传的示例代码

Mar 07 Javascript

Layui实现数据表格默认全部显示(不要分页)

Oct 26 Javascript

VUEX 数据持久化,刷新后重新获取的例子

Nov 12 Javascript

javascript实现切割轮播效果

Nov 28 Javascript

Openlayers测量距离与面积的实现方法

Sep 25 Javascript

jQuery+easyui中的combobox实现下拉框特效

Feb 27 #Javascript

asp.net+js实现金额格式化

Feb 27 #Javascript

JavaScript检测浏览器cookie是否已经启动的方法

Feb 27 #Javascript

jQuery如何防止这种冒泡事件发生

Feb 27 #Javascript

js实现网页右上角滑出会自动消失大幅广告的方法

Feb 27 #Javascript

JavaScript获取元素尺寸和大小操作总结

Feb 27 #Javascript

JS+CSS实现带关闭按钮DIV弹出窗口的方法

Feb 27 #Javascript

You might like

PHP开发中常用的三个表单验证函数使用小结

2010/03/03 PHP

PHP中uploaded_files函数使用方法详解

2011/03/09 PHP

9个PHP开发常用功能函数小结

2011/07/15 PHP

Laravel如何使用Redis共享Session

2018/02/23 PHP

JavaScript cookie的设置获取删除详解

2014/02/11 Javascript

js控制table合并具体实现

2014/02/20 Javascript

JavaScript中实现最高效的数组乱序方法

2014/10/11 Javascript

js实现DOM走马灯特效的方法

2015/01/21 Javascript

浅谈JavaScript Math和Number对象

2015/01/26 Javascript

深入浅析同源策略和跨域访问

2015/11/26 Javascript

详解JavaScript UTC时间转换方法

2016/01/07 Javascript

JavaScript用JSONP跨域请求数据实例详解

2017/01/06 Javascript

JS排序之冒泡排序详解

2017/04/08 Javascript

ajax +NodeJS 实现图片上传实例

2017/06/06 NodeJs

nodejs mysql 实现分页的方法

2017/06/06 NodeJs

js图片放大镜实例讲解(必看篇)

2017/07/17 Javascript

[06:07]刀塔密之二：攻之吾命受之吾幸

2014/07/03 DOTA

[01:10]DOTA2次级职业联赛 - EP战队宣传片

2014/12/01 DOTA

Python中subprocess的简单使用示例

2015/07/28 Python

浅谈Python实现2种文件复制的方法

2018/01/19 Python

python3如何将docx转换成pdf文件

2018/03/23 Python

详解Django中间件的5种自定义方法

2018/07/26 Python

Centos下实现安装Python3.6和Python2共存

2018/08/15 Python

python-web根据元素属性进行定位的方法

2019/12/13 Python

django ObjectDoesNotExist 和 DoesNotExist的用法

2020/07/09 Python

Python调用系统命令os.system()和os.popen()的实现

2020/12/31 Python

实例讲解使用SVG制作loading加载动画的方法

2016/04/05 HTML / CSS

HTML5 新表单类型示例代码

2018/03/20 HTML / CSS

运动会广播稿100字

2014/09/14 职场文书

简单的个人租房协议书范本

2014/11/26 职场文书

品质保证书格式

2015/02/28 职场文书

2016年中秋祝酒词

2015/11/26 职场文书

《时代广场的蟋蟀》读后感：真挚友情，温暖世界！

2020/01/08 职场文书

Python如何使用logging为Flask增加logid

2021/03/30 Python

使用pandas或numpy处理数据中的空值(np.isnan()/pd.isnull())

2021/05/14 Python

python利用while求100内的整数和方式

2021/11/07 Python