Divの要素は、特定のクラスを切り替えるときに移動します。 Javascript DOM

Question

私はJavaScriptで "メモリ"ゲームを作らなければならない学校で課題があります。だから私の旗を隠すために、私は旗の上にある黒い背景の場所である.cardというクラスを作りました。だから、ユーザーがフラグをクリックすると、私はクラス.cardをトグルしたい、それは削除されますが、私はクラスを切り替えると思うフラグをクリックすると、フラグは別のフラグの後ろに移動されます。なぜこれが起こっているのか分かりません。ここで

はjsfiddleは、すべてのコードをので、あなたはそれを試すことができるということです：あなたはフラグを「プライマリ」の背景とpart1をし、その2ないしクリックする必要が https://jsfiddle.net/L2q63k0p/

.card { 
    height: 100px; 
    width: 150px; 
    background-color: black; 
    z-index: 10; 
    position: absolute; 
    opacity: 0.5; 
    pointer-events: none; 
} 

注意してください。

私はすべての助けを歓迎します、これは私の最初の質問ですので、私はそれがすべきことをすべてやったかどうかは分かりません。しかし、私は望む。

Answer 1

あなたの質問が正しいと分かっている場合は、答えが正しい/ .cardクラスが適用されていれば、フラグを削除しますか？
この場合は、CSSのプロパティdisplay: noneを調べる必要があります。あなたが何をしているのかをもう少し明確にするために、あなたの.cardを.hiddenにリネームし、表示をdisplay: noneに入れます。