/ / Jquery введення / виведення курсору миші (кращі практики) - javascript, jquery

Jquery миші над вимиранням / виходом (найкращі практики) - 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();
});
});

Усі пункти меню отримують клас та ідентифікатор topMenu. Відповідний div для відображення - той самий ідентифікатор, що і пункт меню, лише з префіксом _ Приклад: ....

Інформація про нас!

...

Дякую!


2 для відповіді № 4
$(function () {
$("#home").hover(function() {
$("#homeText").fadeIn("slow");
});
$("#home").mouseout(function() {
$("#homeText").fadeOut("slow");
});
});