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 相关文章推荐
JavaScript 继承详解 第一篇
Aug 30 Javascript
Javascript UrlDecode函数代码
Jan 09 Javascript
HTML颜色选择器实现代码
Nov 23 Javascript
基于mootools插件实现遮罩层新手引导
May 24 Javascript
浏览器页面区域大小的js获取方法
Sep 21 Javascript
Vue数据驱动模拟实现3
Jan 11 Javascript
ReactNative页面跳转Navigator实现的示例代码
Aug 02 Javascript
vue-lazyload图片延迟加载插件的实例讲解
Feb 09 Javascript
JQuery事件委托原理与用法实例分析
May 13 jQuery
Vue组件跨层级获取组件操作
Jul 27 Javascript
vue实现简单加法计算器
Oct 22 Javascript
vue项目页面嵌入代码块vue-prism-editor的实现
Oct 30 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
火车头采集器3.0采集图文教程
2007/03/17 PHP
PHP与MySQL开发中页面出现乱码的一种解决方法
2007/07/29 PHP
php 生成文字png图片的代码
2011/04/17 PHP
检查php文件中是否含有bom的函数
2012/05/31 PHP
在wamp集成环境下升级php版本(实现方法)
2013/07/01 PHP
php+jQuery.uploadify实现文件上传教程
2014/12/26 PHP
php生成图片验证码
2015/06/09 PHP
js确认删除对话框效果的示例代码
2014/02/20 Javascript
如何判断微信内置浏览器(通过User Agent实现)
2014/09/01 Javascript
jquery提示效果实例分析
2014/11/25 Javascript
NodeJS使用jQuery选择器操作DOM
2015/02/13 NodeJs
js实现按钮控制带有停顿效果的图片滚动
2016/08/30 Javascript
详解网站中图片日常使用以及优化手法
2017/01/09 Javascript
JS实现div模块的截图并下载功能
2017/10/17 Javascript
详解使用React全家桶搭建一个后台管理系统
2017/11/04 Javascript
JavaScript callback回调函数用法实例分析
2018/05/08 Javascript
Vue实现一种简单的无限循环滚动动画的示例
2021/01/10 Vue.js
wxpython中自定义事件的实现与使用方法分析
2016/07/21 Python
python TCP Socket的粘包和分包的处理详解
2018/02/09 Python
使用Python来开发微信功能
2018/06/13 Python
解决python中的幂函数、指数函数问题
2019/11/25 Python
Django自带的加密算法及加密模块详解
2019/12/03 Python
Python运行提示缺少模块问题解决方案
2020/04/02 Python
Python使用Paramiko控制liunx第三方库
2020/05/20 Python
Python+Selenium实现自动化的环境搭建的步骤(图文)
2020/09/01 Python
python如何设置静态变量
2020/09/07 Python
比驿:全球酒店比价网
2018/06/20 全球购物
J2EE面试题集锦(附答案)
2013/08/16 面试题
高中自我评价分享
2013/12/05 职场文书
男方父母婚礼答谢词
2014/01/25 职场文书
生产部厂长职位说明书
2014/03/03 职场文书
《最佳路径》教学反思
2014/04/13 职场文书
社团活动总结
2014/04/28 职场文书
《鲸》教学反思
2016/02/23 职场文书
学长教您写论文:经验总结
2019/07/09 职场文书
sql注入报错之注入原理实例解析
2022/06/10 MySQL