С Новым годом! Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.80/5: Рейтинг темы: голосов - 5, средняя оценка - 4.80
0 / 0 / 0
Регистрация: 23.08.2011
Сообщений: 5

Проблема со сменой изображений при наведение

25.08.2011, 14:30. Показов 1123. Ответов 4
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте, возникла проблема со скриптом:
Java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<script type="text/javascript" src="./jquery-1.4.2.min.js"></script>
<script type="text/javascript">
//On Doc Ready
$(function() {
   //*************** JQeury Universal Image Button ***************
   function getHoverPath (imgPath) {
      //split imgPath after each '/' and create array to path directories and file name
      var srcPathArray = imgPath.split('/');
      //find image file name get length of srcPathArray and retrieve last item which is the image file ex: "images/buttons/IMG.gif"
      var imgFile = srcPathArray[srcPathArray.length-1];
      //image file name array split at "." to get:[fileName, ext]
      var imgArray = imgFile.split('.');
      //img name (first item in imgArray)
      var imgName = imgArray[0];
      //image ext (second item in imgArray)
      var imgExt = imgArray[1];
      //image src path
      var srcPath = imgPath.split(imgFile , 1);
      // concatenate path and add "_hover" to image file name
      return srcPath + imgName+'_hover.'+ imgExt;
      };
   // get hover button array
   var hoveredButtons = new Array();
            
   $('.js_uniButton').mouseover (function() {
   $this = $(this);
      
      //get image path of this instance
      var imgPath = $this.children('img').attr('src');
      //cache img path url on initial mouseover
      if (typeof(hoveredButtons[ imgPath ]) == 'undefined') {
      hoveredButtons[ imgPath ] = getHoverPath( imgPath );
      //console.log('cache image path ' + imgPath + ' and hover path ' + hoveredButtons[ imgPath ]);
      }
      $this.children('img').attr('src' , hoveredButtons[ imgPath ]);
      
      //mouseout actions
      $this.mouseout(function() {
      //define this handler
         var $this = $(this), handler = arguments.callee;
         //unbind mouseout handler
         $this.unbind('mouseout', handler);
         // on mouseout, swap current image with original image path
         $this.children('img').attr('src' , imgPath);
      });
   });
   //Close On Doc Ready
})
</script>
HTML5
1
2
3
4
<div id="wb_Image1" style="margin:0;padding:0;position:absolute;left:9px;top:17px;width:155px;height:71px;text-align:left;z-index:1;">
<a href="#" class="js_uniButton"><img src="1.png" id="Image1" alt="" border="0" style="width:155px;height:71px;"></a></div>
<div id="wb_Image2" style="margin:0;padding:0;position:absolute;left:187px;top:17px;width:155px;height:71px;text-align:left;z-index:2;">
<a href="#"><img src="1.png" id="Image2" alt="" border="0" style="width:155px;height:71px;"></a></div>
У меня на странице, как видно из кода расположены два Image объекта, сейчас при наведение на первый Image(id=wb_Image1) происходит смена картинки на 1_hover.png
Так вот, я хотел бы как то сделать что бы при наведение, скрипт менял картинку не на первом Image(id=wb_Image1), а на втором т.е Image(id=wb_Image2)

Предполагаю, что проблему можно решить изменив 27 сточку "$this = $(this);" только на что??? в данном случае this выбирает текущий объект...
делал так:
$this = $(document.wb_Image2); но это не работает

Example: demo.zip
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
25.08.2011, 14:30
Ответы с готовыми решениями:

Изменение изображений при наведение мыши
Доброго времени суток, уважаемые форумчане. Вопрос ребят в следующем. есть n-ое количество картинок. Как можно сделать так, что бы....

Проблема с сменой кодировки
Новая проблемка : Русифицировал дату на сайте и сохранил документ в utf-8. Теперь дата на русском , но сам сайт криво отображается, шапка...

Проблема с сменой кодировки
Такая вот проблема : Русифицировал дату на сайте и сохранил документ в utf-8... Из-за этого сайт не правильно отображается ( см. рис 1 ),...

4
 Аватар для Halva
24 / 24 / 2
Регистрация: 02.11.2008
Сообщений: 118
25.08.2011, 15:16
Всё на столько просто, что даже предположить себе не можешь - добавляешь на второй ссылке class="js_uniButton" и счастье тебе! Если не хочешь, чтобы на первой смена происходила - удали класс у первой ссылки.
0
0 / 0 / 0
Регистрация: 23.08.2011
Сообщений: 5
25.08.2011, 15:51  [ТС]
Спасибо за ответ, только вот вы не поняли меня, я хочу что бы мышка попрежнему наводилась к первому объекту, а вот картинка изменялась на втором.
0
0 / 0 / 0
Регистрация: 22.08.2011
Сообщений: 6
26.08.2011, 03:39
в 28 строчке когда ты пишешь
Java
1
$this = $(this);
то говоришь о том, что хочешь работать с данным объектом, то есть с объектом у которого
CSS
1
class = "js_uniButton"
. можешь работать и дальше с классами, тогда тебе нужно задать класс у второй картинки, чтобы они чем-то отличались. и далее соответственно в 28 строчке пишешь
Java
1
$this =  $('.yourClass');
ну а дальше ты уже сам вроде знаешь свой код, просто работаешь уже с этой переменной. а вообще советую тебе прочитать про выборки в jQuery... лучше работай с id, с классами неудобно довольно-таки, хотя в данном случае это может и актуально. удачи
0
0 / 0 / 0
Регистрация: 23.08.2011
Сообщений: 5
26.08.2011, 12:36  [ТС]
Большое спасибо, все заработало
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
26.08.2011, 12:36
Помогаю со студенческими работами здесь

Проблема со сменой разрешения
очень странно ведёт себя вот этот код:DEVMODE dm; dm.dmPelsWidth = screenW; dm.dmPelsHeight = screenH; dm.dmFields = DM_PELSWIDTH...

Проблема при чтении изображений в opencv
Всем привет!) Пишу программу для распознавания лиц с использованием библиотеки opencv на языке c++. Решила все делать в visual studio....

Проблема со сменой процессора ( точнее проблемы)
В общем я в компах не шикбо умен, но что то да понимаю. Решил я обновить себе проц до этого стоял pentium G645 2.90Ghz. Заказал (конечно же...

Проблема с общей производительностью и сменой железа. УЖЕ ВСЕ СДЕЛАЛ, ЧТО МОГ. ГОСПОДА ХРИСТА РАДИ выручайте)
Уже год морочусь с проблемой! Докупил себе оперативы, совместимость с другой плашкой норм оказалась, но комп стал заметно медленее , что в...

Смена Image1 при наведение сохраняя изображения в программу при компиляции
Доброго времени суток ! Суть такова , использую Image в качестве кнопки , хотел реализовать визуальные эфекты при наведение и нажатие ! ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
сукцессия микоризы: основная теория в виде двух уравнений.
anaschu 11.01.2026
https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/
WordPad для Windows 11
Jel 10.01.2026
WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .
Classic Notepad for Windows 11
Jel 10.01.2026
Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .
Почему дизайн решает?
Neotwalker 09.01.2026
В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .
Модель микоризы: классовый агентный подход 3
anaschu 06.01.2026
aa0a7f55b50dd51c5ec569d2d10c54f6/ O1rJuneU_ls https:/ / vkvideo. ru/ video-115721503_456239114
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR
ФедосеевПавел 06.01.2026
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .
Модель микоризы: классовый агентный подход 2
anaschu 06.01.2026
репозиторий https:/ / github. com/ shumilovas/ fungi ветка по-частям. коммит Create переделка под биомассу. txt вход sc, но sm считается внутри мицелия. кстати, обьем тоже должен там считаться. . . .
Расчёт токов в цепи постоянного тока
igorrr37 05.01.2026
/ * Дана цепь постоянного тока с сопротивлениями и источниками (напряжения, ЭДС и тока). Найти токи и напряжения во всех элементах. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа и. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru