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程序设计有所帮助。

Javascript 相关文章推荐
表单提交时自动复制内容到剪贴板的js代码
Mar 16 Javascript
JS获取scrollHeight问题想到的标准问题
May 27 Javascript
JavaScript中的其他对象
Jan 16 Javascript
javascript笔试题目附答案@20081025_jb51.net
Oct 26 Javascript
JQuery Tips(4) 一些关于提高JQuery性能的Tips
Dec 19 Javascript
js控制的遮罩层实例介绍
May 29 Javascript
JS仿JQuery选择器功能
Mar 08 Javascript
通过一个简单的例子学会vuex与模块化
Nov 22 Javascript
vue插件开发之使用pdf.js实现手机端在线预览pdf文档的方法
Jul 12 Javascript
微信小程序实现通过js操作wxml的wxss属性示例
Dec 06 Javascript
小程序云开发之用户注册登录
May 18 Javascript
javascript this指向相关问题及改变方法
Nov 19 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
论坛头像随机变换代码
2006/10/09 PHP
PHP中date()日期函数有关参数整理
2011/07/19 PHP
Ajax中的JSON格式与php传输过程全面解析
2017/11/14 PHP
Thinkphp 框架扩展之Widget扩展实现方法分析
2020/04/23 PHP
goto语法在PHP中的使用教程
2020/09/17 PHP
Google Map Api和GOOGLE Search Api整合实现代码
2009/07/18 Javascript
使用JavaScript switch case 另类写法
2010/03/14 Javascript
js怎么覆盖原有方法实现重写
2014/09/04 Javascript
Angular2表单自定义验证器的实现
2016/10/19 Javascript
详解JS对象封装的常用方式
2016/12/30 Javascript
基于jQuery实现一个marquee无缝滚动的插件
2017/03/09 Javascript
js+html5生成自动排列对话框实例
2017/10/09 Javascript
微信小程序实现动态改变view标签宽度和高度的方法【附demo源码下载】
2017/12/05 Javascript
通过nodejs 服务器读取HTML文件渲染到页面的方法
2018/05/17 NodeJs
Node.js Windows Binary二进制文件安装方法
2019/05/16 Javascript
uniapp微信小程序:key失效的解决方法
2021/01/20 Javascript
python文件和目录操作函数小结
2014/07/11 Python
简介Python的collections模块中defaultdict类型的用法
2016/07/07 Python
python实现图像识别功能
2018/01/29 Python
Django实战之用户认证(用户登录与注销)
2018/07/16 Python
Python语言快速上手学习方法
2018/12/14 Python
对python mayavi三维绘图的实现详解
2019/01/08 Python
python远程连接MySQL数据库
2019/04/19 Python
Python jieba库用法及实例解析
2019/11/04 Python
Python 异步协程函数原理及实例详解
2019/11/13 Python
python代码xml转txt实例
2020/03/10 Python
python不相等的两个字符串的 if 条件判断为True详解
2020/03/12 Python
利用python为PostgreSQL的表自动添加分区
2021/01/18 Python
回馈慈善的设计师太阳镜:DIFF eyewear
2019/10/17 全球购物
品质标语大全
2014/06/21 职场文书
好人好事演讲稿
2014/09/01 职场文书
2015年元旦标语大全
2014/12/09 职场文书
英文导游词
2015/02/13 职场文书
幼儿园小班教学反思
2016/03/03 职场文书
2016年青少年禁毒宣传教育活动总结(学校)
2016/04/05 职场文书
python爬虫之selenium库的安装及使用教程
2021/05/23 Python