jquery 另一种动画滚动方法 取自 Keqie

1452 查看

$(function(){
        setTimeout(function(){
            $('.kq-slider-item:first').fadeIn(); $('.kq-slider').css('background-image','none');
        },600);

        $.extend({
            autoSlider:function(){

                /*if($('.slider .item.selected').next().size()==0){
                    $('.slider .item.selected').removeClass('selected').parent().find('.item:first').addClass('selected');
                }
                else{
                    $('.slider .item.selected').removeClass('selected').next().addClass('selected');
                }*/
                $('.kq-slider-item:first').animate({'opacity':0},200,function(){
                        $(this).css('opacity',1).hide().appendTo($(this).parent());
                        $('.kq-slider-item:first').fadeIn();
                })
            }
        })
        // 函数重复调用,基于jQuery的方法一定要以上面的写法定义,否则这里不会生效
        setInterval("$.autoSlider()",10000);

     $('.kq-slider-prev').click(function(){

            /*if($('.slider .item.selected').next().size()==0){
                    $('.slider .item.selected').removeClass('selected').parent().find('.item:first').addClass('selected');
                }
                else{
                    $('.slider .item.selected').removeClass('selected').next().addClass('selected');
                }*/
                $('.kq-slider-item:first').animate({'opacity':0},200,function(){
                        $(this).css('opacity',1).hide();
                        $('.kq-slider-item:last').prependTo($(this).parent()).fadeIn();
                })
        },
        function(){});

        $('.kq-slider-next').click(function(){

            $('.kq-slider-item:first').animate({'opacity':0},200,function(){
                        $(this).css('opacity',1).hide().appendTo($(this).parent());
                        $('.kq-slider-item:first').fadeIn();
                })
        },
        function(){})
    })