js 背景自动切换
//首页自动更换背景特效开始============================================ var curIndex = 0;
//时间间隔(单位毫秒),每秒钟显示一张,数组共有3张图片放在img文件夹下。
var timeInterval = 4000; //定义一个存放照片位置的数组,可以放任意个,在这里放3个
var arr =["Image/1.jpg","Image/2.jpg","Image/3.jpeg"];
setInterval(changeImg, timeInterval);
function changeImg() { //获得id名为d1的对象
var obj = document.getElementById("index");
if (curIndex == arr.length - 1) {
curIndex = 0;
} else {
curIndex += 1;
}
//设置d1的背景图片
obj.style.backgroundImage= "URL("+arr[curIndex]+")"; //显示对应的图片
}
效果不是很好 切换图片的时候有点卡顿
js 背景自动切换的更多相关文章
- jquery背景自动切换特效
查看效果网址:http://keleyi.com/a/bjad/4kwkql05.htm 本特效的jquery版本只支持1.9.0以下. 代码如下: <!DOCTYPE html PUBLIC ...
- Python3实现Win10桌面背景自动切换
[本文出自天外归云的博客园] 得空写了个自动切换桌面背景图片的小程序.再不写python就要扔键盘了,对vue还有那么一点好感,天天php真是有够烦. 准备工作 准备个文件夹放在桌面上,平时看到什么高 ...
- CSS实现页面背景自动切换功能
From here:http://xiaomiya.iteye.com/blog/2047728 请看效果图: 完整代码如下: <!DOCTYPE HTML> <html> & ...
- 原生js+css3实现图片自动切换,图片轮播
运用CSS3transition及opacity属性 制作图片轮播动画 自己这两天根据用js来控制触发CSS3中transition属性,从而写出来的以CSS3动画为基础,js控制过程的图片轮播 运用 ...
- JS图片自动和可控的轮播切换特效
点击这里查看效果:http://hovertree.com/texiao/js/1.htm HTML文件代码如下: <!DOCTYPE html> <html xmlns=" ...
- js实现图片自动切换效果。
js实现图片自动切换效果,简单实用,原谅我只是一只小菜鸟还在学大神天天写博文装逼. <script language="javascript"> setInterval ...
- js 图片自动循环切换setInterval();
stlye样式定义 <style type="text/css"> body{background-image: url(img/001.jpg ...
- 原生js实现随着滚动条滚动,导航会自动切换的效果
最近学习前端,把前面用原生js写的一段有关tab切换效果的代码贴上,实现的效果比较简陋,请大家见谅 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...
- 原生 JS 实现 VS Code 自动切换输入法状态!这次没有AHK
上一篇文章:使用 AHK 在 VS Code 中根据上下文自动切换输入法状态 给出一个使用 ahk 在 VSCode 自动切换输入法的方法.不过这个方法实际上很蹩脚,一点都不优(zhuang)雅(bi ...
随机推荐
- 超简单工具puer——“低碳”的前后端分离开发
本文由作者郑海波授权网易云社区发布. 前几天,跟一同事(MIHTool作者)讨教了一下开发调试工具.其实个人觉得相较于定制一个类似MIHTool的Hybrid App容器,基于长连的B/S架构的工具其 ...
- java实现简单扫雷游戏
/** * 一个简单的扫雷游戏 MainFram.java */ package www.waston; import java.awt.BorderLayout; import java.awt.C ...
- 五,session数据写入memcached
1,session数据通常保存在服务器端的文件中,它的默认过期时间是1440s.我们可以将session数据保存到memcached中,设定memcached的过期时间大于session过期时间即可. ...
- mybatis源码追踪2——将结果集映射为map
org.apache.ibatis.binding.MapperMethod中execute方法 ...} else if (method.returnsMap()) { result = execu ...
- 基于Spring Boot的Logback日志轮转配置
在生产环境下,日志是最好的问题调试和跟踪方法,因此日志的地位是十分重要的.我们平时经常使用的log4j,slf4j,logback等等,他们的配置上大同小异.这里就结合Spring Boot配置一下L ...
- java中的IO流(输入流与输出流)概述与总结
Java中IO流,输入输出流概述与总结 总结的很粗糙,以后时间富裕了好好修改一下. 1:Java语言定义了许多类专门负责各种方式的输入或者输出,这些类都被放在java.io包中.其中, 所有输入流类都 ...
- D05——C语言基础学PYTHON
C语言基础学习PYTHON——基础学习D05 20180815内容纲要: 1 模块 2 包 3 import的本质 4 内置模块详解 (1)time&datetime (2)datetime ...
- SVN图形客户端上传静态库.a文件失败
1.原因客户端未添加静态库 2.解决办法 到项目静态库所在目录用命令行添加静态库文件 svn add ****.a 3.可能存在问题 Mac OS的自带SVN版本过低不能添加,报错如下: svn: E ...
- vue项目打包后路径出错
安装完vue后搭建了一个项目,直接执行 npm run dev 是可以正常打开页面的: 但是执行 npm run build 打包项目后打开却报错了,如下: 原来是项目中的静态文件路径报错了... 然 ...
- 安装SQL Server 2016出错提示:需要安装oracle JRE7 更新 51(64位)或更高版本完美解决办法
错误提示原因:安装时检测出电脑没有安装JDK,而且是版本7(其他版本不行) 解决方法:先进下面这个网站安装JDK,安装好后配置环境变量,然后重新安装SQL Server 2016即可 http://w ...