Onclick: display-block
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
angegebenen platz
benutzen
bild
code
darstellung
display
dokument
eigenschaft
element
ersetzen
frage
funktion
funktionieren
http
machen
platz
show
syntax
unterschied
url
-
Ich habe auf meiner Seite ein etwas breites Menü und möchte es per Click auf ein Bild unsichtbar (display: none;) machen und bei einem weiteren Click auf ein anderes Bild, welches vorher sichtbar wurde, wieder sichtbar machen
<script type='text/javascript'>
function activate_tabContent(active_div){
$('div#menueshower > div#menue').removeClass('show');
$('div#menueshower > div#reverse').removeClass('notshow');
div#menue.addClass('notshow');
div#reverse.addclass('show');
}
</script>
<script type='text/javascript'>
function deactivate_tabContent(active_div){
$('div#menueshower > div#reverse').removeClass('show');
$('div#menueshower > div#menue').removeClass('notshow');
div#menue.addClass('show');
div#reverse.addclass('notshow');
}
Dies Funktioniert aber nicht, das heißt, es wird nicht umgeschaltet
Beitrag zuletzt geändert: 15.12.2013 19:32:09 von matthias-detsch -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
ich würde da mit so vorgehen:
dein Menü hat jetzt zb. die id navi. und dann hat du noch die beiden bilder mit den ids button1 und button2
<div id="navi">menü</div> <img id="button1" onclick="func1();"/> <img id="button2" onclick="func2();" style="visibility:hidden;"/>
und dann halt Javascript:
function func1 (){ document.getElementById('navi').style.visibility='hidden'; document.getElementById('button1').style.visibility='hidden'; document.getElementById('button2').style.visibility='visible'; } function func2 (){ document.getElementById('navi').style.visibility='visible'; document.getElementById('button1').style.visibility='visible'; document.getElementById('button2').style.visibility='hidden'; }
- fertig
sollte eig. funktionieren wenn ich keine Tippfehler gemacht habe. -
Hi!
Ich bin in JS nicht soo bewandert, aber müsstest du bei "div#menue.addClass('show');" nicht auch den jQuery-Syntax "$('div#menue'),addClass('show');" anwenden? Außerdem könntest du doch auch ".show()" und ".hide()" benutzen, damit setz jQuery eigenständig "display='hidden'". Es gibt auch Code für die Nutzung von ".toggle(showOrHide)", die ein- und ausblendet.
Warum du den Funktionen einen Wert übergibst, den du nicht nutzt verstehe ich auch nicht so recht...
Ich denke aber, der Fehler liegt in dem Syntax vom Zugriff auf die Elemente. Gegebenenfalls würd ich da wirklich mal mit document.getElementById ran gehen um diese Fehlerquelle auszuschließen :)
Grüße
things -
things schrieb:
Warum du den Funktionen einen Wert übergibst, den du nicht nutzt verstehe ich auch nicht so recht...
Das wr noch von früher-ein relikt aus altertümlicher zeit
@socialcloud
dein code funktioniert. aber ich habe eine Frage: kann man
.style.visibility='hidden';
durch
.style.display='none';
ersetzen?
Beitrag zuletzt geändert: 17.12.2013 18:14:23 von matthias-detsch -
Zwischen den beiden Eigenschaften gibts einen Unterschied:
display: none verhindert die Darstellung eines Elements. Es nimmt so keinen Platz im Dokument ein.
visibility: hidden macht ein Element unsichtbar, aber erhält den durch weitere Eigenschaften angegebenen Platz im Dokument.
Siehe auch hier:
http://www.css4you.de/visibility.html
http://www.css4you.de/display.html -
hsg-elbmarsch schrieb:
Zwischen den beiden Eigenschaften gibts einen Unterschied:
display: none verhindert die Darstellung eines Elements. Es nimmt so keinen Platz im Dokument ein.
visibility: hidden macht ein Element unsichtbar, aber erhält den durch weitere Eigenschaften angegebenen Platz im Dokument.
Siehe auch hier:
http://www.css4you.de/visibility.html
http://www.css4you.de/display.html
Das weiß ich sehr wohl, und genau das möchte ich ja auch bezwecken.
Sonst bringt das ausblenden ja gar gar nischte -
aber ich habe eine Frage: kann man
.style.visibility='hidden';
durch
.style.display='none';
ersetzen?
Hab ich deine Frage falsch verstanden? Ja, kannst du ersetzen, allerdings unter Beachtung des Unterschieds. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage