Jquery实现图片播放

来源：互联网发布：php访客统计编辑：程序博客网时间：2024/04/28 22:18
初步实现图片播放
<pre name="code" class="javascript">/** * Created by Administrator on 2016/2/28. */$(document).ready(function(){    //鼠标悬停图片暂停切换    $("li").hover(function () { clearInterval(t); });   //鼠标离开图片切换继续    $("li").mouseleave(function () { changepic(); });});var t;var speed = 2;//图片切换速度var startTime=0;//图片开始时间onload = changepic();function changepic(){    var  numOfImg =  $("li>a>img").length;    $("li").hide();    $("li").eq(startTime).show();    startTime = (startTime+1 ==numOfImg) ?0:(startTime + 1);    t = setTimeout("changepic()", speed * 1000);}

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <link type="text/css" rel="stylesheet" href="../css/scroll_images.css"/>    <script type="text/javascript" src="../scripts/jquery-1.7.1.min.js"></script>    <script type="text/javascript" src="../scripts/scroll_images2.js"></script></head><body><div id="aa">    <ul id="list">        <li id="li1"><a href=""><img src="../images/1.gif" width="950" height="80"></a> </li>        <li id="li2"><a href=""><img src="../images/2.gif" width="950" height="80"></a> </li>        <li id="li3"><a href=""><img src="../images/3.gif" width="950" height="80"></a> </li>    </ul></div></body></html>
0 0