<html>
<head>
<meta charset="utf-8" />
<title></title>

<script type="text/javascript">
window.onload=function(){

var img=document.getElementById('img');

var num=0;
var a=['img/16.jpg','img/2.jpg','img/2 (12).jpg','img/2(13).jpg'];
var btn1=document.getElementById('btn1');
var btn2=document.getElementById('btn2');

btn1.onclick=function(){

num++;
if(num==4){

num=0;

}
img.src=a[num];
}
btn2.onclick=function(){

if(num==0){

num=4;

}
num--;
img.src=a[num];
}

}

</script>
</head>
<body>

<img src="img/16.jpg" height="400px" width="400px" id="img" />

<input type="button" value="+" id="btn1" />
<input type="button" value="-" id="btn2" />

</body>
</html>

js 数组切换图片的更多相关文章

  1. js多种切换图片

    分享通过js实现多种图片切换特效,这里只有手动切换哦,自动效果需自写,效果地址:http://dwz.cn/1drD5u. 下载地址:http://***/download/index/52209 适 ...

  2. js自动切换图片

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. js 循环切换图片

    function changeLot(){ var minIndex = 1; var maxIndex = 100; var curIndex = 10; var src = $("ul ...

  4. js动态切换图片

    <script language =javascript > $(function () { initAds(); }); function initAds() { var curInde ...

  5. js 上下切换图片

    <html><head lang="en"> <meta charset="UTF-8"> <title>< ...

  6. 原生js+css3实现图片自动切换，图片轮播

    运用CSS3transition及opacity属性 制作图片轮播动画 自己这两天根据用js来控制触发CSS3中transition属性,从而写出来的以CSS3动画为基础,js控制过程的图片轮播 运用 ...

  7. 原生JS—实现图片循环切换及监测鼠标滚动切换图片

    今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法以及如何检测鼠标滚动循环切换图片.多余的话我们就不多说了,我们一个一个开始讲吧. 1  原生JS实现图片循环切换 -- 方法一 在上栗子之前我们 ...

  8. jquery插件jquery.LightBox.js之点击放大图片并左右点击切换图片（仿相册插件）

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的点击放大图片并左右点击切换图片的效果,您可以根据自己的实 ...

  9. [js开源组件开发]js轮播图片支持手机滑动切换

    js轮播图片支持手机滑动切换 carousel-image 轮播图片,支持触摸滑动. 例子见DEMO http://www.lovewebgames.com/jsmodule/carousel-ima ...

随机推荐

  1. javascript函数作用域实践

    在es6之前,JavaScript是没有块级作用域的,只有函数作用域,也就是说是一个function里面定义的变量外面取不到的:而if for是条件判断的语句,不是函数,由于缺少块级作用域,所以条件中 ...

  2. HDU 5845 Best Division

    $dp$,字典树. $dp$递推式很容易知道.dp[i]=max{dp[j]+1} a[j]^..^a[i]<=X,并且$[j,i]$长度不能超过$L$. 但是暴力来复杂度极高,所以需要用字典树 ...

  3. FZU 1627 Revival's road

    矩阵快速幂. #pragma comment(linker, "/STACK:1024000000,1024000000") #include<cstdio> #inc ...

  4. Linux性能监测：CPU篇(转)

    http://os.51cto.com/art/201012/239880.htm CPU 的占用主要取决于什么样的资源正在 CPU 上面运行,比如拷贝一个文件通常占用较少 CPU,因为大部分工作是由 ...

  5. 推荐一篇很好的介绍wpf dependency property的文章

    http://www.codeproject.com/Articles/140620/WPF-Tutorial-Dependency-Property

  6. map 理解

    键值对 map会将同名的值覆盖掉 public static void main(String[] args) { Map<String,String> maptest=new HashM ...

  7. dplyr 数据操作 数据过滤 (filter)

    在R的使用过程中我们几乎都绕不开Hadley Wickham 开发的几个包,前面说过的ggplot2.reshape2以及即将要讲的dplyr 因为这几个包可以非常轻易的使我们从复杂的数据操作中逃离, ...

  8. hdu_5961_传递（bitset）

    题目链接:hdu_5961_传递 题意: 中文,不解释 题解: 上bitset卡常,很优美的就过去了 #include<bits/stdc++.h> #define F(i,a,b) fo ...

  9. openwrt下关于snmpd的一些信息

    cd /tmp/ 上传: tftp -gr libnetsnmp_5.4.4-1_ar71xx.ipk 192.168.11.56 安装: opkg install libnetsnmp_5.4.4- ...

  10. Openjudge-计算概论（A）-找和为K的两个元素

    描述: 在一个长度为n(n < 1000)的整数序列中,判断是否存在某两个元素之和为k. 输入第一行输入序列的长度n和k,用空格分开.第二行输入序列中的n个整数,用空格分开.输出如果存在某两个元 ...