JavaScript实现背景自动切换小案例


Posted in Javascript onSeptember 27, 2019

本文实例为大家分享了js实现背景自动切换的具体代码,供大家参考,具体内容如下

JavaScript实现背景自动切换小案例

功能:

窗口打开背景图自动跳转切换

所有代码:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>背景切换</title>
</head>
<body>
<img src="img/1.jpg" width="500" id="imgId"/>
</body>
</html>
<script type="text/javascript">
 window.onload = function () {

 setInterval(step, 1000);
 }
 var num = 1;
 function step() {
 if (num < 5) {
  num++;
 } else {
  num = 1;
 }
 var dom = document.getElementById("imgId");
 //更改它images的src属性
 dom.src = 'img/' + num + '.jpg';
 }

</script>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery Tools tooltip使用说明
Jul 14 Javascript
JS事件Event元素(兼容IE,Firefox,Chorme)
Nov 01 Javascript
用JavaScript实现类似于ListBox功能示例代码
Mar 09 Javascript
上传图片js判断图片尺寸和格式兼容IE
Sep 01 Javascript
node.js操作mongoDB数据库示例分享
Nov 26 Javascript
javascript关于继承解析
May 10 Javascript
Js调用Java方法并互相传参的简单实例
Aug 11 Javascript
详解nvm管理多版本node踩坑
Jul 26 Javascript
node.js Promise对象的使用方法实例分析
Dec 26 Javascript
vue随机验证码组件的封装实现
Feb 19 Javascript
js实现弹窗效果
Aug 09 Javascript
详解TypeScript的基础类型
Feb 18 Javascript
vue监听用户输入和点击功能
Sep 27 #Javascript
vue实现文字加密功能
Sep 27 #Javascript
微信小程序 动态修改页面数据及参数传递过程详解
Sep 27 #Javascript
vue实现购物车小案例
Sep 27 #Javascript
解决layui中onchange失效以及form动态渲染失效的问题
Sep 27 #Javascript
layui 地区三级联动 form select 渲染的实例
Sep 27 #Javascript
vue实现移动端省市区选择
Sep 27 #Javascript
You might like
php实现文件下载简单示例(代码实现文件下载)
2014/03/10 PHP
php对文件进行hash运算的方法
2015/04/03 PHP
PHP数据库操作Helper类完整实例
2016/05/11 PHP
PHP中SERIALIZE和JSON的序列化与反序列化操作区别分析
2016/10/11 PHP
javascript学习笔记(十六) 系统对话框(alert、confirm、prompt)
2012/06/20 Javascript
JavaScript设计模式之单例模式实例
2014/09/24 Javascript
jQuery中html()方法用法实例
2014/12/25 Javascript
jQuery插件实现适用于移动端的地址选择器
2016/02/18 Javascript
javascript基础知识
2016/06/07 Javascript
Js 获取、判断浏览器版本信息的简单方法
2016/08/08 Javascript
nodejs和php实现图片访问实时处理
2017/01/05 NodeJs
Angularjs单选改为多选的开发过程及问题解析
2017/02/17 Javascript
利用Vue v-model实现一个自定义的表单组件
2017/04/27 Javascript
AngularJS实现的JSONP跨域访问数据传输功能详解
2017/07/20 Javascript
Node.js创建Web、TCP服务器
2017/12/05 Javascript
vue 项目打包通过命令修改 vue-router 模式 修改 API 接口前缀
2018/06/13 Javascript
微信小程序仿朋友圈发布动态功能
2018/07/15 Javascript
js使用ajax传值给后台,后台返回字符串处理方法
2018/08/08 Javascript
JS对象和字符串之间互换操作实例分析
2019/02/02 Javascript
javascript实现贪吃蛇经典游戏
2020/04/10 Javascript
Python实现全角半角字符互转的方法
2016/11/28 Python
在python中安装basemap的教程
2018/09/20 Python
python实现网页自动签到功能
2019/01/21 Python
Django Channels 实现点对点实时聊天和消息推送功能
2019/07/17 Python
Django框架模型简单介绍与使用分析
2019/07/18 Python
Python中list的交、并、差集获取方法示例
2019/08/01 Python
Numpy数组array和矩阵matrix转换方法
2019/08/05 Python
django的403/404/500错误自定义页面的配置方式
2020/05/21 Python
Django rest framework分页接口实现原理解析
2020/08/21 Python
StubHub新加坡:购买和出售全球活动门票
2017/03/10 全球购物
关于递归的一道.NET面试题
2013/05/12 面试题
普通院校学生的自荐信
2013/11/27 职场文书
生物学学生自我评价
2014/01/17 职场文书
银行求职信怎么写
2014/05/26 职场文书
小学生交通安全寄语
2015/02/27 职场文书
2016大学军训通讯稿
2015/11/25 职场文书