JavaScriptの要素で：：アクティブ状態を解除するにはどうすればよいですか？

Question

私は、あなたがそれをクリックすると、CSSトランジションを使って内側の要素がスライドアップする要素を持っています。私は親ノードのCSS ':activeの内部要素の高さを変更することでこれを行います。私は後でこれを解除する方法を理解できません。次の作業はありません：

/* NONE OF THESE WORK */ 
//Attempt 1 
document.activeElement = null; 

//Attempt 2 
document.activeElement.blur(); 

//Attempt 3 
document.body.focus(); 

//Attempt 4 
document.body.click(); 

//Attempt 5 
myElement.blur(); 

有効にしない方法がありますか？

Answer 1

あなたはelement.classList.remove("hasactive");

var inner = document.getElementById("inner"); 
 

 
inner.addEventListener("transitionend", function(evt){ 
 
\t this.parentNode.classList.remove("hasactive"); 
 
})

#outer:active #inner { 
 
    height: 200px; 
 
    
 
} 
 
#inner { 
 
    background: red; 
 
    height: 0; 
 
    transition: height 1s linear; 
 
    -webkit-transition: height 1s linear; 
 
} 
 
#outer { 
 
    height: 30px; 
 
    background:blue; 
 
}

<div id="outer"> 
 
    <div id="inner"> 
 
    
 
    </div> 
 
</div>