基于jquery的图片切换效果

query,一个很不错的javascript框架. 具体可以参考 http://www.jquery.com/今天用jquery框架写了个类似QQ新闻首页的图片切换效果.
能兼容 IE 6.0+, FF 2+, Safari 2.0+, Opera 9.0+ .
点这里看看效果吧
下面的效果实现的JS代码,得益于jquery框架,代码比较短了.

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()", 3000);   
}   
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);   
}  

上一篇: jQuery---2款流行的广告效果   下一篇: 收藏下一个jquery 的 图片滚动 代码插件---jcarousellite

提交疑问

回顶部