/**
 * created by sarina on 2016/9/27.
 */

$(function() {

    var lin = $(".join .scroll .bd li").length;
    $("#scroll .bd ul").width(lin * ($("#scroll .bd li").width() + 32) );

    var pan = math.ceil(lin / 4);
    for (var i = 0; i < pan; i++) {
        $('#scroll .hd').append('<span class="span' + i + ' png"></span>');
    }

    scroll($('#scroll'), pan);
});

function scroll(obj,num){
    var list = obj;
    var listn = num;

    $("#scroll .hd").css('margin-left', -$("#scroll .hd").width() / 2);

    var sw = 0;
    myshow(sw);
    obj.find('.hd span').mouseover(function(){
        sw = $(this).index();
        myshow(sw);
    });
    function myshow(sw){
        obj.find('.hd').each(function() {
            $(this).find('span').eq(sw).addclass("on").siblings("span").removeclass("on");
        });
        obj.find('ul').each(function() {
            $(this).stop(true,true).animate({marginleft: -(obj.width()+32)*sw}, 400);
        });
    }
    //����ֹͣ������������ʼ����
    // obj.hover(function(){
    //     if(mytime){
    //        clearinterval(mytime);
    //     }
    // },function(){
    //     clearinterval(mytime);
    //     mytime = setinterval(function(){
    //         myshow(sw);
    //         sw++;
    //         if(sw==listn){sw=0;}
    //     } , 4000);
    // })
    //�զ���ʼ
    // mytime = setinterval(function(){
    //     myshow(sw);
    //     sw++;
    //     if(sw==listn){sw=0;}
    // } , 4000);
}