powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как показать картинку при наведении на ссылку
11 сообщений из 11, страница 1 из 1
Как показать картинку при наведении на ссылку
    #38397977
dakota1310
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Как показать картинку при наведении на ссылку и скрыть картинку если курсор не на ссылки.
Пробовала сделать так но не получается. Помогите пожалуйста.
Код: html
1.
2.
3.
4.
5.
<ul>
  <li>
    <a href="" class="tooltip" >Камера 1 <span style="display: none;"><img src="image004.png"/></span></a>
  </li>
</ul>


Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
<script>
$(".tooltip").hover(function(){ 
  //alert("www");
   $('.tooltip span').show();
  },function(){
    $('.tooltip span', this)).hide();
  });
</script>
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38397993
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Я взял Ваш код, подправил опечатку и он работает:
http://jsfiddle.net/Fk3Vh/
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38397996
Zoria
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
dakota1310,

Код: sql
1.
2.
3.
<style>
a.tooltip:hover span{display:block}
</style>
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38397998
dakota1310
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Спасибо, а можете если в списке несколько ссылок с одним и тем же классом, как при наведении на ссылку сделать так чтобы отображалась нужная картинка, а не все сразу. Заранее огромное спасибо.
Код: html
1.
2.
<li><a href="" class="tooltip" >Камера 1 <span><img src="image004.png"/></span></a></li>
<li><a href="" class="tooltip" >Камера 2 <span><img src="image005.png"/></span></a></li>
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38398002
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
$('.tooltip span').show();
заменить на
$(this).find('span').show();
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38398006
dakota1310
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Работает $(this).find('span').show(); и самое последние как поставить задержку в 2 сек.
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38398007
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
...show(2000)
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38398011
dakota1310
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
огромное спасибо всем.))
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38398016
dakota1310
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
а можно добавить эффект всплывания
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38398020
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
...
Рейтинг: 0 / 0
Как показать картинку при наведении на ссылку
    #38398349
ILLHEAD
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
[quot dakota1310]Как показать картинку при наведении на ссылку и скрыть картинку если курсор не на ссылки.
я юзаю простой скрипт. пример http://meryland24.ru/gotovie_proekti/derevjannie_doma/777 - фокус " следущий ". в отладке есть источник скрипта (сайт разработчика). модификация под себя на раз-два
...
Рейтинг: 0 / 0
11 сообщений из 11, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как показать картинку при наведении на ссылку
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]