Archief - Probleempje jquery/css

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.

Gogeta

Legacy Member
Ik heb volgend probleem:

- Ik heb een <li> met een id bv id="hydraterend".
- Ik heb een paar divs met class="hydraterend".

bedoeling:

- Klikken op de <li> zou de classes zichtbaar en onzichtbaar moeten maken.
- Klikken op de <li> zou de achtergrond van de <li> blauw moeten maken en zo blijven tot ik het nog eens aanklik.
- Hoveren over de <li> zorgt er voor dat <li> een lichtblauw krijgt

wat ik heb:

De jquery:
Code:
$("#hydraterend").toggle(
	function(){
		$(this).css("background-color", "#cfcced");
		$(".hydraterend").fadeToggle("slow");
	},
	function(){
		$(this).css("background-color", "transparent");
		$(".hydraterend").fadeToggle("slow");
	}
);

De css:
Code:
#producten_filter li:hover {
	background-color:#cfcced;
	}

Probleem:
- Als ik hover over de <li> werkt alles goed, als ik klik op de <li> ook, maar eens geklikt werkt de hover niet meer .

Oplossing?


ps (moest in JS staan niet Q)

Fr3aK

Legacy Member
$(this).css("background-color", "transparent");

veranderen naar:

$(this).css("background-color", "");

JS overschrijft namelijk uw vooraf gedefinieerde CSS (background-color in li:hover) tenzij je hem dus reset naar de originele waarde door een lege string mee te geven.

brecko

Legacy Member
Even ter zijde: dat uw content naar beneden scrollt (waardoor uw menu onzichtbaar wordt)
vind ik alles behalve gebruiksvriendelijk..

Ok, je hebt klikbare breadcrumbs, maar da's nog altijd een stap extra he.

Gogeta

Legacy Member
Fr3aK zei:
$(this).css("background-color", "transparent");

veranderen naar:

$(this).css("background-color", "");

JS overschrijft namelijk uw vooraf gedefinieerde CSS (background-color in li:hover) tenzij je hem dus reset naar de originele waarde door een lege string mee te geven.

Ok ik ga het zsm proberen aan te passen en zien wat het geeft ;)


brecko zei:
Even ter zijde: dat uw content naar beneden scrollt (waardoor uw menu onzichtbaar wordt)
vind ik alles behalve gebruiksvriendelijk..

Ok, je hebt klikbare breadcrumbs, maar da's nog altijd een stap extra he.

Dat scrollen is iets waar ik zelf ook nog niet zeker van ben. Het is wel zo dat ik het bovenste deel wil houden (deel met filmpje etc, dit gaat wss een carrousel worden). Helaas neemt dit wel wat in op het scherm, vandaar de scroll.

Nu ben ik bij verschillende internet "leken" gaan horen (het doelpubliek) en sommige zijn er voor en sommigen niet...

Gogeta

Legacy Member
Fr3aK zei:
$(this).css("background-color", "transparent");

veranderen naar:

$(this).css("background-color", "");

JS overschrijft namelijk uw vooraf gedefinieerde CSS (background-color in li:hover) tenzij je hem dus reset naar de originele waarde door een lege string mee te geven.


Werkt, bedankt, zo iets simpel haha manman
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan