Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как показать картинку при наведении на ссылку / 11 сообщений из 11, страница 1 из 1
16.09.2013, 17:57
    #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
16.09.2013, 18:13
    #38397993
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
Я взял Ваш код, подправил опечатку и он работает:
http://jsfiddle.net/Fk3Vh/
...
Рейтинг: 0 / 0
16.09.2013, 18:14
    #38397996
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
dakota1310,

Код: sql
1.
2.
3.
<style>
a.tooltip:hover span{display:block}
</style>
...
Рейтинг: 0 / 0
16.09.2013, 18:16
    #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
16.09.2013, 18:20
    #38398002
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
$('.tooltip span').show();
заменить на
$(this).find('span').show();
...
Рейтинг: 0 / 0
16.09.2013, 18:24
    #38398006
dakota1310
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
Работает $(this).find('span').show(); и самое последние как поставить задержку в 2 сек.
...
Рейтинг: 0 / 0
16.09.2013, 18:26
    #38398007
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
...show(2000)
...
Рейтинг: 0 / 0
16.09.2013, 18:29
    #38398011
dakota1310
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
огромное спасибо всем.))
...
Рейтинг: 0 / 0
16.09.2013, 18:33
    #38398016
dakota1310
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
а можно добавить эффект всплывания
...
Рейтинг: 0 / 0
16.09.2013, 18:38
    #38398020
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
...
Рейтинг: 0 / 0
17.09.2013, 09:30
    #38398349
ILLHEAD
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Как показать картинку при наведении на ссылку
[quot dakota1310]Как показать картинку при наведении на ссылку и скрыть картинку если курсор не на ссылки.
я юзаю простой скрипт. пример http://meryland24.ru/gotovie_proekti/derevjannie_doma/777 - фокус " следущий ". в отладке есть источник скрипта (сайт разработчика). модификация под себя на раз-два
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как показать картинку при наведении на ссылку / 11 сообщений из 11, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


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