1 var StackCards = function(parent) {2 this.dom = parent;3 this.stack = ([]);4 5 this.dom.setAttribute('b', 'StackCards');6 }7 8 StackCards.prototype.push = function(card) {9 var top = this.stack[this.stack.length-1];10 11 12 card.setAttribute('b', 'Card');13 card.classList.add('Card-out');14 this.stack.push(card);15 16 card.addEventListener('transitionend', function(e){17 if (top != null)18 top.style.display = 'none';19 }, false);20 21 this.dom.appendChild(card);22 card.offsetTop; // Refresh render tree23 card.classList.remove('Card-out');24 }25 26 StackCards.prototype.pop = function() {27 var card = this.stack.pop();28 this.dom.removeChild(card);29 return card;30 }31 32 33 ////////////////////////////////////////////////////////////7734 35 var TestCard = function(n) {36 var dom = document.createElement('div');37 dom.innerHTML = 'THIS IS A CARD ('+n+')';38 return dom;39 }40 41 ////////////////////////////////////////////////////////////////42 43 var ms; //main stack44 45 window.addEventListener('load', function() {46 ms = new StackCards(document.body);47 48 var f = function(event){49 var c = new TestCard('otra');50 c.addEventListener('click', f, true);51 ms.push(c);52 }53 54 f();55 }, true);Enlace
El enlace para compartir es: