dve funkcie jQuery, ktoré sa vzájomne ovplyvňujú - jQuery

Mám 2 funkcie jquery, ktoré niečo robiapodobné (jeden na prejdenie myšou, druhý na kliknutie) a zdá sa, že si navzájom prekážajú. Prvý zmení pozadie pomocou prepínača triedy jquery ui pri prechode myšou. Tým sa otvorí aj podmenu. Keď kliknete na odkaz v podponuke, spustí sa funkcia kliknutia, ktorá odstráni predchádzajúcu ponuku. a používa switchclass na zmenu tohto pozadia. Problém je v tom, že akonáhle pohnete myšou, myš sa vysunie a pozadie sa zmení späť na predvolené pozadie.

Toto je prejdenie myšou.

     $(".hoverbg").mouseover(
function(){
var newimg = $(this).attr("data-bgsrc");
$("#bg img[src="/images/"+newimg+""]").switchClass("inactive", "active", 0, "easeInOutQuad");
$("#bg img[src!=""+newimg+""]").switchClass("active", "inactive", 0, "easeInOutQuad");
});
$(".nav").mouseout
(function(){
if ($("#sitewrapper").hasClass("c"))
{
event.stopImmediatePropagation()
}
else
{
$("#bg img[src="images/bg.jpg"]").switchClass("inactive", "active", 0, "easeInOutQuad");
$("#bg img[src!="images/bg.jpg"]").switchClass("active", "inactive", 0, "easeInOutQuad");
}
});

Tu je udalosť kliknutia.skrýva triedu nav, ktorá je súčasťou myšou. technicky si myslím, že ste z toho menu vyšli myšou, ale mám ho pridať triedu do div sitewrapper a zastaviť, ak je trieda prítomná.

    $("a#navclick").click(function(){
var iclick = $(this).attr("data-iclick");
var clickimg = $(this).attr("click-data-bgsrc");
if ($("#topId").hasClass(".topOn"))
{
$("#bg img[src="/images/"+clickimg+""]").switchClass("inactive", "active", 0, "easeInOutQuad");
$("#bg img[src!=""+clickimg+""]").switchClass("active", "inactive", 0, "easeInOutQuad");
}
else
{
$("#sitewrapper").addClass("c");
$("img.logo").hide("drop", {direction: "down"}, 1000);
$(".nav").hide("drop", {direction: "down"}, 1000);
$("#bg img[src=""+clickimg+""]").switchClass("inactive", "active", 0, "easeInOutQuad");
$("#bg img[src!=""+clickimg+""]").switchClass("active", "inactive", 0, "easeInOutQuad");
$("#topId").addClass("topOn");
$("#topId").show("slide", {direction:"up"}, 1000);
}
});

odpovede:

Mám to vymyslené. Funkcia kliknutia bola v poriadku, vyzerá to takto;

    $("a#navclick").click(function(){
var iclick = $(this).attr("data-iclick");
var clickimg = $(this).attr("click-data-bgsrc");
if ($("#topId").hasClass("topOn"))
{
$("#bg img[src="/images/"+clickimg+""]").switchClass("inactive", "active", 0, "easeInOutQuad");
$("#bg img[src!=""+clickimg+""]").switchClass("active", "inactive", 0, "easeInOutQuad");
}
else
{
$("#topId").addClass("topOn");
$("img.logo").hide("drop", {direction: "down"}, 1000);
$(".nav").hide("drop", {direction: "down"}, 1000);
$("#bg img[src!=""+clickimg+""]").switchClass("active", "inactive", 0, "easeInOutQuad");
$("#bg img[src=""+clickimg+""]").switchClass("inactive", "active", 0, "easeInOutQuad");
$("#topId").show("slide", {direction:"up"}, 1000);
}
});

Funkcia hover potrebovala na zastavenie príkaz ifstalo sa to raz kliknutie. Takže som nechal kliknutie pridať triedu do div, ktorý sa stane viditeľným, s názvom topOn. potom pridal príkaz if, ktorý kontroluje, či tento div má triedu topOn. Vyzerá to takto;

     $(".hoverbg").mouseenter(
function(){
var newimg = $(this).attr("data-bgsrc");
$("#bg img[src="/images/"+newimg+""]").switchClass("inactive", "active", 0, "easeInOutQuad");
$("#bg img[src!=""+newimg+""]").switchClass("active", "inactive", 0, "easeInOutQuad");
});
$(".hoverbg").mouseleave
(function(){
if(jQuery("#topId").hasClass("topOn"))
{
jQuery(".hoverbg").stop();
}
else
{
$("#bg img[src="images/bg.jpg"]").switchClass("inactive", "active", 0, "easeInOutQuad");
$("#bg img[src!="images/bg.jpg"]").switchClass("active", "inactive", 0, "easeInOutQuad");
}
});