daniel/emacs
1
2
Fork 0
Code Issues 7 Pull Requests Projects Releases Wiki Activity

change flipcard style to feature images and change flip event to click

Browse Source
This commit is contained in:
Daniel Weschke
2021-01-24 19:55:09 +01:00
parent 7921df18ac
commit acbdac806b
2 changed files with 62 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
scripts/flipcard/flipcard.js
View File

@@ -1,12 +1,12 @@
function flipcard_main() {
var cardFront = document.getElementsByClassName("fc-thefront");
var cardFront = document.getElementsByClassName("fcfront");
var i;
var flip;
for (i = 0; i < cardFront.length; i++) {
flip = document.createElement("div");
flip.appendChild(document.createTextNode("flip"));
flip.className = "fc-flip";
flip.addEventListener("mouseover", event => {
flip.className = "fcflip";
flip.addEventListener("click", event => {
var flip = event.target;
var front = flip.parentElement;
var card = front.parentElement;
@@ -14,18 +14,19 @@ function flipcard_main() {
});
cardFront[i].appendChild(flip);
};
var cardBack = document.getElementsByClassName("fc-theback");
var cardBack = document.getElementsByClassName("fcback");
var i;
for (i = 0; i < cardBack.length; i++) {
cardBack[i].addEventListener("mouseleave", flipcard_mouseLeave, true);
}
};
function flipcard_mouseLeave(event) {
if (event.target.className == "fc-theback") {
var back = event.target;
var card = back.parentElement;
card.style.transform = "rotateY(0deg)";
}
flip = document.createElement("div");
flip.appendChild(document.createTextNode("flip"));
flip.className = "fcflip";
flip.addEventListener("click", event => {
var flip = event.target;
var front = flip.parentElement;
var card = front.parentElement;
card.style.transform = "rotateY(0deg)";
});
cardBack[i].appendChild(flip);
};
};
flipcard_main();