Навигация по кнопке Nav поменяет соответствующие изображения - PullRequest
Новая
       32

Навигация по кнопке Nav поменяет соответствующие изображения

0 голосов
/ 07 ноября 2011

Мне тяжело оборачиваться вокруг этого.

концепция навигации http://i44.tinypic.com/k96u04.png

При наведении курсора на кнопку панели навигации изображение меняется на соответствующий «прожектор», тот, что находится непосредственно под ним.

Я пробовал многоразличные подходы, и поскольку я все еще далек от запоминания всего спектра функций jQuery, я просто не могу понять этот.

Пока что это лучший, но он требует, чтобы я назначилИдентификатор для каждого элемента, и я не смог выяснить, как добиться хорошего перекрестного затухания. 

$('a#nav2').hover(function() {
    $('#nav2_light').attr("src","../img/nav/light_bright.png");
}, function() {
    $('#nav2_light').attr("src","../img/nav/light.png");
});

Я пытаюсь найти: 1. Более эффективный метод выполнения этого для каждогоКнопка навигации и соответствующий прожектор 2. Способ плавного затенения изображений.fadeOut и fadeIn полностью затухают перед тем, как добавить следующий. Это не то, что я ищу.

Я понимаю, что вопросы, подобные этому, были заданы, но те, которые я нашел, имеютвсе были случаи только с одним изображением.Я хотел бы сделать функцию повторяемой для каждого пункта меню.Идеи?Заранее благодарю за помощь!

Редактировать: Просто чтобы уточнить, кнопки навигации и прожекторы - это отдельные объекты.Я не уверен, что $ будет работать в этом случае.На иллюстрации у меня есть кнопки навигации в одном div, а прожекторы в другом.

Edit 2: Я немного поиграл с этим, и я полагаю, что он работаетесли я просто назначу идентификатор для каждого.Тем не менее, я все еще ищу способ заставить своп сделать перекрестный переход.Кто-нибудь знает, как это сделать, если я использую функцию .attr?

1 Ответ

0 голосов
/ 07 ноября 2011

используйте класс для каждого элемента, который вы хотите добавить эту функцию и 

$('.class_name').hover(function() {     
$(this).attr("src","../img/nav/light_bright.png");         
}, function() {  
   $(this).attr("src","../img/nav/light.png"); 
});
...