Jquery仿彩票更換數字動畫效果

<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function($) {
        var y=3;
        $("input").click(function(event) {
            $("ul li").each(function(index, el) {
                ///開始///隨機函數
                function createRandom(num ,from ,to )
                {
                    var arr=[];
                    for(var i=from;i<=to;i++)
                        arr.push(i);
                    arr.sort(function(){
                        return 0.5-Math.random();
                    });
                    arr.length=num;
                    return arr;
                }
                 
                function createRandom2(num , from , to)
                {
                    var arr=[];
                    var json={};
                    while(arr.length<num)
                    {
                        //產生單個隨機數
                        var ranNum=Math.ceil(Math.random()*(to-from))+from;
                        //經過判斷json對象的索引值是否存在 來標記 是否重複                    
                        if(!json[ranNum])
                        {
                            json[ranNum]=1;
                            arr.push(ranNum);
                        }                             
                    }
                    return arr;         
                }
                ///結束///隨機函數
                var arr=[];//聲明一個空的數組
                arr=createRandom2(7,1,33)/*將隨機生成的0-33的7個數字賦值給arr*/
                //定義了sort的比較函數將arr數組裏面的數字
                arr.sort(function(a,b){
                    return a-b;
                });
                //利用循環讓每一個li取到arr數組的值
                for(var i=0;i<=$("ul li").size();i++){                         
                    $("ul li").eq(i).text(arr[i]);
                }
                /*每一個圓轉的度數等於  y*360*/
                y++;
                $("ul li").eq(index).css({
                    "transform": 'rotate('+y*360+'deg)',
                    "-moz-transform": 'rotate('+y*360+'deg)',
                    "-webkit-transform": 'rotate('+y*360+'deg)',
                    "-o-transform": 'rotate('+y*360+'deg)',
                    "-s-transform": 'rotate('+y*360+'deg)'
                });
            });
            //判斷隨機生成的是否是小於10若是是的就給前面加上0如生成的是1那麼就顯示01
            $("ul li").each(function(index, el) {
                if (parseInt($(this).text())<10) {
                    var cc=$(this).text();
                    $(this).text("0"+cc)
                };
            });
        });
    });
</script>
相關文章
相關標籤/搜索