/ / Jquery затихване / изчезване с мишката (най-добри практики) - javascript, jquery

Jquery мишка над Fade-In / Out (най-добрите практики) - javascript, jquery

Имам работещ код на Jquery за избледняване на / изписване на описателен текст в div под въпроса. Проблемът? Решението не е много елегантно. Ето какво имам:

$("#home").mouseover(function() {
$("#homeText").fadeIn("slow");
});
$("#homeText").mouseout(function() {
$("#homeText").fadeOut();
});

Знам, че има по-добър начин да направя това, просто не съм сигурен какво е това.

Отговори:

21 за отговор № 1

бихте могли да използвате курсора на мишката, първата функция ще действа при „задръжте курсора на мишката“, а втората ще действа върху „курсора на мишката“

Документацията се намира тук: http://docs.jquery.com/Events/hover

$("#home").hover(function(){
$("#homeText").fadeIn("slow");
},
function(){
$("#homeText").fadeOut();
});

6 за отговор № 2

Какво ще кажете за 3 реда?

<script>

$(function () {

$("#home").hover(function() {
$("#homeText").fadeToggle("slow");
});

});


</script>

Достатъчно елегантен?


2 за отговор № 3

Джон, страхотен съвет! Използвах като точка за гледане, но за по-пълно решение. Правейки това само с основния ховър, все пак ще ми остави повикване за ховър за единичен елемент от менюто .. Много излишен код. Така че, използвайки това, което предложихте, измислих това:

$(".topMenu").hover(function()
{
$("#_"+this.id).fadeIn("slow");
},
function ()
{
$("#_"+this.id).fadeOut();
});
});

Всички елементи от менюто получават класа и ID на topMenu. Съответният div за показване е същият идентификатор като елемента от менюто, само с префикс _ Пример: ....

Неща за нас!

...

Благодаря!


2 за отговор № 4
$(function () {
$("#home").hover(function() {
$("#homeText").fadeIn("slow");
});
$("#home").mouseout(function() {
$("#homeText").fadeOut("slow");
});
});