js实现图片自动切换效果。
js实现图片自动切换效果,简单实用,原谅我只是一只小菜鸟还在学大神天天写博文装逼。
<script language="javascript">
setInterval(test, 2000);
var array = new Array();
var index = 0;
var array = new Array("../../Content/images/3s1hj_kqzew4k2ozbhs2dwgfjeg5sckzsew_780x520.jpg", "../../Content/images/3s1hj_kqzewqs2ozbhsrdwgfjeg5sckzsew_450x600.jpg", "../../Content/images/3s1hj_kqzfc4leozbhmtcugfjeg5sckzsew_650x975.jpg");
function test() {
var myimg = document.getElementById("imgs");
if (index == array.length - 1)
{ index = 0; } else { index++; }
myimg.src = array[index];
}
</script> 在页面需要的地方添加这个:
↓
↓
↓
<img style="width:200px; height:200px" id="imgs" src="../../Content/images/3s1hj_kqzdoqs2ozbhsq3wgfjeg5sckzsew_450x600.jpg" />
js实现图片自动切换效果。的更多相关文章
- 原生js+css3实现图片自动切换,图片轮播
运用CSS3transition及opacity属性 制作图片轮播动画 自己这两天根据用js来控制触发CSS3中transition属性,从而写出来的以CSS3动画为基础,js控制过程的图片轮播 运用 ...
- tab切换效果 网站中的图片自动切换
网站中的图片自动切换 今天上一套tab切换效果的代码 动图就自己实现吧! 下面贴HTML代码,大体分两部分,图片div和按钮div,代码很容易看懂~ <!DOCTYPE html> < ...
- 基于jquery鼠标点击图片翻开切换效果
基于jquery鼠标点击图片翻开切换效果是一款基于jQuery+CSS3实现的点击图片切换特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class=&quo ...
- jquery 图片自动切换
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JS实现图片翻书效果示例代码
js 图片翻书效果. picture.html <html xmlns="http://www.w3.org/1999/xhtml"> <head> ...
- JS实现图片翻书效果
picture.html <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http- ...
- 原生JS—实现图片循环切换的两种方法
今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法.多余的话我们就不多说了,我们一个一个开始讲吧. 1 原生JS实现图片循环切换 -- 方法一 在上栗子之前我们先简单介绍一下所用的一些知识点. ...
- 原生JS—实现图片循环切换及监测鼠标滚动切换图片
今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法以及如何检测鼠标滚动循环切换图片.多余的话我们就不多说了,我们一个一个开始讲吧. 1 原生JS实现图片循环切换 -- 方法一 在上栗子之前我们 ...
- 原生JS实现图片循环切换
<!-- <!DOCTYPE html> <html> <head> <title>原生JS实现图片循环切换 —— 方法一</title&g ...
随机推荐
- iPhone手机VPN设置
如果iPhone,iPad游戏或软件服务器在国外不能用,就需要设置VPN了. 如果是为了解除公司上网策略限制,或者为了上Google,Facebook,都可以通过设置VPN实现. 要使用VPN需要到V ...
- Hashtable,HashMap实现原理
http://blog.csdn.net/czh0766/article/details/5260360 昨天看了算法导论对散列表的介绍,今天看了一下Hashtable, HashMap这两个类的源代 ...
- 定制ckeditor的菜单
修改配置文件config.js来定制cheditor的菜单,需要以下步骤: 1.找到ckeditor安装目录的config.js文件 2.记下要使用的功能名,以下的"-"代表分隔符 ...
- HTTP 状态代码
转自:https://support.google.com/webmasters/answer/40132 HTTP 状态代码 如果向您的服务器发出了某项请求要求显示您网站上的某个网页(例如,当用户通 ...
- Quartz 有状态的JobDataMap
Quartz,每次执行job,job永远是全新的对象,但是,如果job实现org.quartz.StatefulJob接口,而不是job接口. 此时JobDetail的JobDataMap将会共享一个 ...
- ConcurrentHashMap的get、put、size
ConcurrentHashMap的get操作 get操作的高效之处在于整个get过程不需要加锁,get方法里将要使用的共享变量都定义成volatile. ConcurrentHashMap的Put操 ...
- 如何快速使用ECharts绘制可视化图表
1.在ECharts官网,下载ECharts的源码和示例文件. 2.解压缩下载下来的Echars压缩包,找到doc\example\www\echartsjs目录,将里面的js文件全部取出来,放到项目 ...
- ServiceStack.Redis常用操作 - 事务、并发锁
一.事务 使用IRedisClient执行事务示例: using (IRedisClient RClient = prcm.GetClient()) { RClient.Add("key&q ...
- 使用 Chef 管理 Azure 资源
发布于 2014-07-08 作者 陈 忠岳 Chef 是一款开源的开发运营(DevOps)工具,用以应对 IT 基础设施方面的挑战.微软开放技术有限公司(简称"微软开放技术" ...
- 身为java程序员你需要知道的网站(包含书籍,面试题,架构...)
推荐几本书<高级java程序员值得拥有的10本书>, 首页 所有文章 资讯 Web 架构 基础技术 书籍 教程 我要投稿 更多频道 » - 导航条 - 首页 所有文章 资讯 Web ...