Javascript getElementByID.style

Hallo, ich habe auf unserer homepage ein image mit einem onclick-Event. Das Event ruft folgende javascript-Funktion auf:
function AppMenSwitch(){
var AppMenH = document.getElementById("Field07").style.visibilit y;
if (AppMenH = "hidden") {
document.getElementById("Field07").style.height = "inherit";
document.getElementById("Field07").style.visibilit y = "visible";
document.getElementById("MeTog").style.visibility = "hidden";
} else {
document.getElementById("Field07").style.height = "0px";
document.getElementById("Field07").style.visibilit y = "hidden";
}
}
Die gewünschte Funktionalität ist, dass das Script das Field07 im Wechsel sichtbar bze. unsichtbar macht. Das wird auch gut erledigt, wenn ich von unsichtbar auf sichtbar schalte. Umgekehrt funktioniert es aber nicht. Der Code springt nicht in die "else"-Bedingung. Ich habe den Wert von AppMenH mit alert("AppMenH"); abgefragt - hier werden "hidden" und "visible" korrekt angezeigt. Danke für Antworten!

Der hier verwendete Code

<style> *{ margin:0; padding:0; box-sizing:border-box; } body { display: flex; flex-wrap: wrap; flex-direction: row; width: 100vw; height: 100vh; align-content: space-around; justify-content: space-around; align-items: center; } figure{ max-width:300px; border:2px solid black; margin:30px; text-align:center; width:calc(50vw - 64px); max-height:50vh; overflow:hidden; } figcaption{ height:100px; text-align:center; padding:5px; visibility:visible; } img{ width:100%; cursor:pointer; max-height:calc(50vh - 100px); } figcaption.ausgeblendet{ visibility:hidden; } </style> <body> <figure> <img src="https://basti1012.de/bilder/10.png"> <figcaption> Text Container 1 der auf unsichtbar gesetz werden soll</figcaption> </figure> <figure> <img src="https://basti1012.de/bilder/5.png"> <figcaption> Text Container 3 der auf unsichtbar gesetz werden soll</figcaption> </figure> <figure> <img src="https://basti1012.de/bilder/4.png"> <figcaption> Text Container 4 der auf unsichtbar gesetz werden soll</figcaption> </figure> <figure> <img src="https://basti1012.de/bilder/3.png"> <figcaption> Text Container 5 der auf unsichtbar gesetz werden soll</figcaption> </figure> <script> // Klick auf das Bild läst den Text darunter verschwinden let img_ele=document.querySelectorAll('figure'); img_ele.forEach(function(g){ g.children[0].addEventListener('click',function(){ g.children[1].classList.toggle('ausgeblendet'); }) }) </script> </body>

Add Comment

* Required information
1000
Drag & drop images (max 3)
Powered by Commentics

Comments

No comments yet. Be the first!