Code: Alles auswählen
<span class="clipper" onclick="$('#subnav1').toggleClass('on')"></span>
<div class="subnav" id="subnav1">Code: Alles auswählen
<body lang="de" onclick="$('.subnav').removeClass('on')">Code: Alles auswählen
$( "#body" ).click(function() {
$('#subnav1').toggleClass('on');
});Code: Alles auswählen
$( "#body" ).click(function() {
$('.subnav').removeClass('on');
});Mit stopPropagation().webghost hat geschrieben:[...] weil das betreffende Element sich ja auch im Body befindet. Somit kann ich keines mehr öffnen, weil der Klick auf öffnen bzw. toggle zugleich auch ein Klick auf body also remove ist.
wie umgehe ich das Problem, mit Abfragen?
Code: Alles auswählen
$("nav").click(function(event) {
event.stopPropagation();
$("body").click(function() {
$('.subnav').removeClass('on');
});
});
Code: Alles auswählen
<li class="hassub" id="active">
<a href="">test</a>
<span class="clipper" onclick="$('#subnav1').toggleClass('on')"></span>
<div class="subnav on" id="subnav1">
<span class="closer" onclick="$('#subnav1').removeClass('on')"></span>
<ul class="lev2">
<li><a id="current" href="">Konsumkredite</a></li>
<li><a href="">test</a></li>
<li><a href="">test</a></li>
</ul>
</div>
</li>
<li class="hassub">
<a href="">test</a>
<span class="clipper" onclick="$('#subnav2').toggleClass('on')"></span>
<div class="subnav" id="subnav2">
<span class="closer" onclick="$('#subnav2').removeClass('on')"></span>
<ul class="lev2">
<li><a href="">test</a></li>
<li><a href="">test</a></li>
<li><a href="">test</a></li>
</ul>
</div>
</li>
Code: Alles auswählen
$(".clipper").click(function(event) { //.clipper - alle betreffende Buttons
var stop = $(this).next(".subnav"); // nächster auszuschliessender div.subnav
$(stop).click(function(event) {
event.stopPropagation();
$("body").click(function() {
$('.subnav').removeClass('on');
});
});
});
Du hast dir ja im Prinzip selbst schon die Antwort gegeben. Einfach alle "on"s entfernen und dann das geklickte Element damit versehen.webghost hat geschrieben:vielleicht könntest Du mir noch einen weiteren Denkanstoss geben?
wenn jetzt "#subnav1 .subnav" offen ist und ich öffne "#subna2 .subnav" wie erreiche ich das sich dabei #subnav1 zugleich schliesst? also allen Elementen mit .subnav das .on wieder entfert wird ausser natürlich bei #subnav2, wobei es natürlich nicht immer das selbe Element ist.
Sind bestimmt Basic's aber ich tu mich da echt schwer
. und will es dann doch noch so umschreiben wie RexDude meinte.das stimmt nicht ganz; mitwebghost hat geschrieben:ne das passt nicht weil ja immer ein Element sichtbar ist
Code: Alles auswählen
![[ externes Bild ]](http://maumha.de/muh/schaf.gif){kind=link}
active: falseCode: Alles auswählen
$(document).ready(function($) {
// ein und ausblenden
$(".clipper").click(function() {
$(".clipper").not(this).next('.subnav').removeClass('on');
$(this).next('.subnav').toggleClass('on');
});
// button zum schliessen
$(".closer").click(function() {
$(this).parent('.subnav').removeClass('on');
});
// bei klick auf Body alles zu
$(".clipper").click(function(event) {
event.stopPropagation();
$("body").click(function() {
$('.subnav').removeClass('on');
});
});
});