码迷,mamicode.com
首页 > 其他好文 > 详细

鼠标单击切换图片

时间:2017-06-17 17:16:45      阅读:182      评论:0      收藏:0      [点我收藏+]

标签:技术分享   nload   get   ack   ima   jpg   else   index   ffffff   


    

<style>
    body{background:#000000;text-align:center;}
    h1{margin:40px;color:#FFFFFF;font-weight:bold;}  
    hr{color:#FFFFFF;margin:20px;}
    #Bos{width:500px;height:200px;margin:100px auto;}
</style>



<script>
  window.onload=function()

  {
    var curIndex=0;
    var arr=new Array();
    arr[0]="img_1.jpg";
    arr[1]="img_2.jpg";
    arr[2]="img_3.jpg";
    var img=document.getElementById(‘img‘);

    img.onclick=function(){

    if(curIndex==arr.length-1)
    {
      curIndex=0;
    }
    else
    {
      curIndex+=1;
    }

    img.src=arr[curIndex];
    }
  }

</script>

 

<body>
    <h1>图片自动切换</h1>
    <hr />  
    <div id="Bos">
      <img src="img_1.jpg" id="img" style="width:500px;height:200px;"/>
    </div>
</body>

技术分享

 

鼠标单击切换图片

标签:技术分享   nload   get   ack   ima   jpg   else   index   ffffff   

原文地址:http://www.cnblogs.com/xiaoyangtian/p/7040407.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!