jquery 图片播放轮换

本文主要是介绍jquery 图片播放轮换，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

效果如图:

<TITLE>js图片播放轮换</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<SCRIPT src="js图片播放轮换.files/jquery-1[1].2.1.pack.js"
type=text/javascript></SCRIPT>

<STYLE type=text/css> {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; FONT-FAMILY: Verdana
}
IMG {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
#pic {
MARGIN: 5px; OVERFLOW: hidden; WIDTH: 300px; CURSOR: pointer; HEIGHT: 200px
}
#play {
MARGIN-TOP: -30px; MARGIN-LEFT: 200px; POSITION: absolute
}
#play A {
BORDER-RIGHT: #cedef7 1px solid; BORDER-TOP: #cedef7 1px solid; DISPLAY: block; FLOAT: left; BORDER-LEFT: #cedef7 1px solid; WIDTH: 20px; COLOR: #2f49df; LINE-HEIGHT: 20px; MARGIN-RIGHT: 3px; BORDER-BOTTOM: #cedef7 1px solid; HEIGHT: 20px; BACKGROUND-COLOR: #e8fceb; TEXT-ALIGN: center; TEXT-DECORATION: none
}
</STYLE>

<SCRIPT type=text/javascript>
var _c = _h = 0;
$(function(){
    $('#play > a').click(function(){
        var i = $(this).attr('alt') - 1;
        clearInterval(_h);
        _c = i;
        play();
        change(i);
    })
    $("#pic img").hover(function(){clearInterval(_h)}, function(){play()});
    play();
})
function play()
{
    _h = setInterval("auto()", 1000);
}
function change(i)
{
    $('#play > a').css('background-color','#E8FCEB').eq(i).css('background-color','#C6FF5E').blur();
    $("#pic img").hide().eq(i).fadeIn('slow');
}
function auto()
{
    _c = _c > 2 ? 0 : _c + 1;
    change(_c);
}
</SCRIPT>