More Information.

CSS Flip Card Effect with 'Chase the Ace' Game

Check the face value of the playing cards below using mouse over or touch to locate the Ace of Hearts then
Click Here
and use mouse over or touch to pick the card which you think is the Ace.



CSS3 based Flip Card Effect



This page uses a CSS animation to generate a flip card effect and javaScript to create a simple card guess game. The fCSS for the flip effect can be found in the header section of this page. The game requires four unique random integers, one for each card. The function I used to generate the integers is as follows:

let numof = 4;
let maxnum = 4;

function getrand(){
let numof = 4;
let maxnum = 4;
while(randarr.length < numof){
let rand = Math.floor(Math.random() * maxnum) + 1;
if(randarr.indexOf(rand) === -1) randarr.push(rand);
}
return(randarr);
}