2015-05-29 47 views
0

我在頁面上有一些正方形,當點擊翻轉時,就像一張卡片,所以你可以看到背面。使用CSS類翻轉頁面中的隨機元素在JS中使用CSS類

JS小提琴:http://jsfiddle.net/d1botfu2/

,似乎工作正常,但是,我也會每隔幾秒鐘就像一個方形自動翻轉(幾乎像一個屏幕保護程序),然後翻轉回來,用翻轉另一隨機的與點擊事件相同的動畫。

我一直在使用一個切換嘗試,但事實證明它白

$(document).ready(function() { 

function change() { 
    randomElements = jQuery("div.flipper").get().sort(function(){ 
     return Math.round(Math.random())-0.5 
    }).slice(0,1) 
    $(randomElements).toggle('active'); 
    console.log("Change"); 
} 

setInterval(function() { 
    change(); 
}, 1000); 

}); 
+0

你得到一個隨機的顏色,但不要做任何事情。 – artm

+0

對不起,當我試圖讓它工作 – user1724416

回答

1

飄通」你的代碼並做了一些修復。希望這是您正在尋找的解決方案,

$(document).ready(function() { 

function change() { debugger; 
    randomElements = jQuery("div.flip-container").get().sort(function(){ 
     return Math.round(Math.random())-0.5 
    }).slice(0,1) 

    $(randomElements).toggleClass('active'); 
    console.log("Change"); 
} 

setInterval(function() { 
    change(); 
}, 1000); 

});

http://jsfiddle.net/d1botfu2/4/

+0

這完美的工作! – user1724416

+0

hmmm .. tats kool .. – obuliraj

-1

看看這個:https://api.jquery.com/eq-selector/

這一個:http://www.w3schools.com/jsref/jsref_random.asp

使用一個隨機數,你可以選擇一個類類型的隨機元素。

未經測試的例子:

$(".div.flipper:eq(' + Math.floor(Math.random() * 10) + ')").trigger('click') 

^這應該選擇1和10(或更精確地,0和9)之間的隨機的紙牌,並觸發其click -event

window.setInterval(function(){ 
    $(".div.flipper:eq(' + Math.floor(Math.random() * 10) + ')").trigger('click') 
    flipTimer ; 
}, 1000);