【Jquery】年会抽奖，头像滚动抽奖，自定义中奖号码

头像滚动思路：主要以轮播图的思路为主

1、每个中奖用户设置一个div，每个div放置9张图片组成一列

2、点击开始的时候，通过传入每个需要滚动的dom对象，方法里面都重新定义，这样就每个滚动的方法和dom对象就不会相互干扰了

3、dom对象相对定位，图片列表绝对定位，通过定时移动dom对象里面的图片列表的top，实现动画效果

4、开始滚动的时候，把图片列表的第一张图片克隆放到列表的最后，当滚动到最后一张图片的时候，就把tip设为0

5、点击停止的时候，如果图片滚到最后一张图片的时候，就把定时器清除就可以了

注意：定时器的时间间隔尽量短一点，这样就不会出现掉帧

function startrun(dom){
    var i = 0;
    var j = 0;
    var endtime = 5;//定时器的速度
    var speed = 5;//每次移动多少像素
    dom.append(dom.find(".prizeboxmove").eq(0).clone());
    var size = dom.find(".prizeboxmove").size();
    var domheight = dom.height() - 180;
    var timer = setInterval(function () {
        var top = speed * i;
        if(j == 3){
            domheight = 1850;
            if(top >= 1850){
                $("#startfn").show();
                $("#stopbtn").hide(); 
                $("#startfn").html("抽奖");                   
                $("#stopbtn").html("停止");
                $(".prizeboxtitle2box").show();
                clearInterval(timer);
            }
        }
        if(top >= domheight){
            if(endbool){
                j += 1;
                speed -= 1;
            }else{
                if(speed <= 8){
                    speed += 1;
                }
            }
            i = 0;
        }
        dom.css({
            'top':-top+"px"  //dom标签的动画为向上移动；
        });
        i += 1;
    },endtime);
}

效果展示：

github地址：https://github.com/shijianfeishi/prizedraw.git

https://github.com/shijianfeishi/prizedraw.git

https://github.com/shijianfeishi/prizedraw.git