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 相关文章推荐
基于jquery的拖动布局插件
Nov 25 Javascript
js键盘上下左右键怎么触发function(实例讲解)
Dec 14 Javascript
Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击
Feb 12 Javascript
Javascript排序算法之计数排序的实例
Apr 05 Javascript
jQuery实现鼠标悬停背景翻转的黑色导航菜单代码
Sep 14 Javascript
全面了解JavaScript对象进阶
Jul 19 Javascript
JS中showModalDialog关闭子窗口刷新主窗口用法详解
Mar 25 Javascript
validationEngine 表单验证插件使用实例代码
Jun 15 Javascript
Angular刷新当前页面的实现方法
Nov 21 Javascript
深入理解es6块级作用域的使用
Mar 28 Javascript
解决vue 表格table列求和的问题
Nov 06 Javascript
详细聊聊vue中组件的props属性
Nov 02 Vue.js
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文件下载类
2006/12/06 PHP
zf框架的Filter过滤器使用示例
2014/03/13 PHP
php线性表的入栈与出栈实例分析
2015/06/12 PHP
php封装的smarty类完整实例
2016/10/19 PHP
使用PHP下载CSS文件中的所有图片【几行代码即可实现】
2016/12/14 PHP
ThinkPHP3.1.2 使用cli命令行模式运行的方法
2020/04/14 PHP
JavaScript Event学习第四章 传统的事件注册模型
2010/02/07 Javascript
JQuery AJAX 中文乱码问题解决
2013/06/05 Javascript
javascript中sort() 方法使用详解
2015/08/30 Javascript
JS如何判断是否为ie浏览器的方法(包括IE10、IE11在内)
2015/12/13 Javascript
jQuery图片轮播功能实例代码
2017/01/29 Javascript
原生js实现选项卡功能
2017/03/08 Javascript
微信小程序表单验证错误提示效果
2017/05/19 Javascript
关于使用axios的一些心得技巧分享
2017/07/02 Javascript
angularjs利用directive实现移动端自定义软键盘的示例
2017/09/20 Javascript
你应该知道的几类npm依赖包管理详解
2017/10/06 Javascript
Bootstrap4如何定制自己的颜色和风格
2018/02/26 Javascript
基于vue-element组件实现音乐播放器功能
2018/05/06 Javascript
微信小程序调用摄像头隐藏式拍照功能
2018/08/22 Javascript
微信小程序冒泡事件及其阻止方法实例分析
2018/12/06 Javascript
echarts实现词云自定义形状的示例代码
2019/02/20 Javascript
深入理解webpack process.env.NODE_ENV配置
2020/02/23 Javascript
vue中的双向数据绑定原理与常见操作技巧详解
2020/03/16 Javascript
详谈vue中router-link和传统a链接的区别
2020/07/22 Javascript
在Python的Django框架的视图中使用Session的方法
2015/07/23 Python
Python 利用邮件系统完成远程控制电脑的实现(关机、重启等)
2019/11/19 Python
简单介绍一下pyinstaller打包以及安全性的实现
2020/06/02 Python
无惧面试,带你搞懂python 装饰器
2020/08/17 Python
解决pytorch 模型复制的一些问题
2021/03/03 Python
用css3实现当鼠标移进去时当前亮其他变灰效果
2014/04/08 HTML / CSS
巴西网上药店:Drogaria Araujo
2021/01/06 全球购物
路政管理专业推荐信
2013/11/11 职场文书
自荐信格式技巧有哪些呢
2013/11/19 职场文书
员工入职担保书范文
2014/04/01 职场文书
企业活动策划方案
2014/06/02 职场文书
使用Python脚本对GiteePages进行一键部署的使用说明
2021/05/27 Python