jQuery ефект при hover() на елемент

[Fakeheal]

Здравейте,

имам един елемент, който е с фиксирана ширина и дължина (div) и върху него с z-index и position съм наместила още 2 други елемента, чийто display е none. До тук успях да направя с hover() върху дива да се показват другите 2 елемента, а искам да могат да се кликат. В смисъл, нали разбирате, че когато те се покажат и hover()-на върху тях се скриват, защото мишката вече не е на div-а, ами върху другите елементи.

Някакви идеи как да ги show-на или просто с jQuery и css да сменя display на блок, при хуувър на div-a и въпреки това да са click-able?

 

[tedo96]

.show()
:idea:

 

[Nazi_93]

Ами ако пробваш да им добавиш клас,в който са видими?
[js]$(".first_div").removeClass("stariq_klas").addClass("active");[/js]
и после
[js]$("#first_div").click(function(){
//code goes here
});
secondfirst_div").click(function(){
//code goes here
});
[/js]

 

[Fakeheal]

.show()
:idea:

.show(), toggle(), slide() - бла, бла, все като мина върху другите 2 елемента се отменя функцията, щото тя е при hover() само на div-a.

@Nazi_93 - Може ли да пробваш пак да обясниш, че не разбрах :roll:

 

[Nazi_93]

Ами правиш класа по подразбиране както си е да са 1 в/у друг и са невидими.(както до сега,но вместо ID-class) и отделно правиш друг клас (ще го кръстя active) Когато класа на дивовете е "active" те са видими (display:block). И когато цъкнеш на изходния див(когато искаш да се покажат другите 2) правиш следното:

$(".main_div").click(function(){
$("first_div").removeClass("Imeto_na_stariq_klas").addClass("active");
$("second_div").removeClass("Imeto_na_stariq_klas").addClass("active");
});

т.е. при клик на изходния див се показват другите 2 и остават видими докато не рефрешнеш страницата и не кликнеш отново на 1-вия (изходния) див.
Дано си ме разбрала

 

[Karcho]

event.stopPropagation

 

[Fakeheal]

Ами правиш класа по подразбиране както си е да са 1 в/у друг и са невидими.(както до сега,но вместо ID-class) и отделно правиш друг клас (ще го кръстя active) Когато класа на дивовете е "active" те са видими (display:block). И когато цъкнеш на изходния див(когато искаш да се покажат другите 2) правиш следното:

$(".main_div").click(function(){
$("first_div").removeClass("Imeto_na_stariq_klas").addClass("active");
$("second_div").removeClass("Imeto_na_stariq_klas").addClass("active");
});

т.е. при клик на изходния див се показват другите 2 и остават видими докато не рефрешнеш страницата и не кликнеш отново на 1-вия (изходния) див.
Дано си ме разбрала

Разбрах те, но това не ме устройва. Искам при маусаут да се връщат на display: none.

@Karcho - това ме устройва

 

[IzKuFeLiQqQqQ]

@Fakeheal за hover() има и как да сложиш "mouseout"
казано на jquery-ски:
[js]$('#clickme').hover(function() {
$('#showme').show();
},function() {
$('#showme').hide();
}
);[/js]

:wink:

 

[tedo96]

@Fakeheal за hover() има и как да сложиш "mouseout"
казано на jquery-ски:
[js]$('#clickme').hover(function() {
$('#showme').show();
},function() {
$('#showme').hide();
}
);[/js]

:wink:

И аз имах предвид нещо такова...

 

[shterev]

може да направиш при моусеовер да се показва асмо и когато има моусеоут от това кеото е показано тогава да се скрива

 

[sandh]

https://developer.mozilla.org/en/DOM/event.relatedTarget

Това също може да е от полза.