jQuery携帯端末九宮格抽選コード

JQuery CSS 3登録ページでは、フォーカスを取得した後に文字が浮き上がるようにヒントを与えるアニメーション効果を実現
抽選をクリック

 $btn.click(function () {
        if (bool) {//    
            bool = false;
            if (data.count > 0) {//     
                data.count--;
                $change.html(data.count);
                clickFn();
            } else {
                alert("        0，    ~");
            }
        }
    });

クリックして回転

 function clickFn() {
        clearInterval(timer);//          
        var random = [1, 2, 3, 4, 5, 6, 7, 8];//    
        //data        ，        
        random = random[Math.floor(Math.random() * random.length)];//1-8    
        mark += random;
        mark %= 8;
        //    ，         
        if (mark === 3) {//              
            random++;
            mark++;
        }
        if (mark === 6) {//              
            random--;
            mark--;
        }
        //    4 
        random += 32;//   *     
        //      
        for (var i = 1; i <= random; i++) {
            setTimeout(animate(), 2 * i * i);//      ，        
        }
        //      
        setTimeout(function () {
            console.log("  " + mark);
            setTimeout(function () {
                bool = true;
                win();
            }, 1000);
        }, 2 * random * random);
    }

アニメーション効果

 function animate() {
        return function () {
            $blin.toggleClass("blin");//    
            //     
            length++;
            length %= 8;
            $prize.eq(length - 1).removeClass("select");
            $prize.eq(length).addClass("select");
        }
    }

オンラインプレビュー:http://www.jquery66.com/demos/js/j20194102/index.htmlダウンロード先:https://u18725144.ctfile.com/fs/18725144-357933582
転載先:https://blog.51cto.com/14168515/2372453