Забыли пароль?
Запросите новый здесь.

Автор темы: jikaka
ID темы: 488
Информация:
Тема содержит 8 сообщения, была просмотрена 1470 раз.  Имеются прикрепленные файлы.
Просмотр темы
PHP-Fusion Russia » Веб-разработка » HTML и CSS
 Распечатать тему
картинка при наведении
jikaka
ситуация такая...
есть картинка в виде ссылки определенного размера, например 200 на 100
при наведении подгружаю картинку размером 200 на 300
так вот, если при наведении тащить курсор вниз, то из-за того, что картинка больше по высоте,
курсор остается активным даже за пределами изначальной картинки, т.е. 200 на 100
как выйти из ситуации?
что-то туплю под конец рабочего дня...
 
Web
yury
пример на скрине покажи, а то не понялё
 
jikaka
вот такая ситуация
jikaka присоединено следующее:изображение:
hover.gif

 
Web
Polarfox
Если там нет ссылки, ссылкой с курсом pinter/hand она быть не может, значит нужно убрать это нечто-ссылку.

пример в хтмл если желаешь чтобы вопрос решился, я все равно не совсем понимаю как и что.
Всегда делайте backup перед изменениями | Указывайте свою версию в подписи/профиле.
Ежели кто забанен за спам, но не считает себя ботом: можете сообщить мне об этом, все будет хорошо.

PolarLab - вход для подопытных
 
Web
jikaka
вот часть кода на html, обычная табличка:
Загрузить источник  GeSHi: PHP
  1. <table align="center" class="links" cellpadding="0" cellspacing="0" border="0">
  2. <tr>
  3. <td class="on-site"><a href="http://www.site.ru" class="link-site">Вход на сайт</a></td>
  4. <td width="150">&nbsp;</td>
  5. <td class="on-forum"><a href="http://www.site.ru/forum/" class="link-forum">Вход на форум</a></td>
  6. </tr>
  7. </table>
Добавлено за 0.033 секунд, используя GeSHi 1.0.8.10

вот часть кода стилей для перехода по ссылке на форум:
Загрузить источник  GeSHi: CSS
  1. .on-forum {
  2. vertical-align: top;
  3. background: url(../images/on-forum.png) no-repeat;
  4. }
  5.  
  6. a.link-forum {
  7. display: block;
  8. width: 235px;
  9. height: 200px;
  10. font-weight: bold;
  11. color: #fc0103;
  12. text-transform: uppercase;
  13. text-decoration: none;
  14. background: transparent url(../images/forum.png) no-repeat;
  15. padding: 10px 0 0 10px;
  16. margin: 21px 0 0 23px;
  17. }
  18.  
  19. a.link-forum:hover {
  20. width: 235px;
  21. height: 300px;
  22. color: #fff;
  23. background: url(../images/forum-hover.png) no-repeat;
  24. margin: 21px 0 0 22px;
  25. }
Добавлено за 0.005 секунд, используя GeSHi 1.0.8.10

 
Web
Rasmusok
Я конечно все понимаю но... ap

a.link-forum { - картинка в виде ссылки
height: 200px;
- строка...

и

a.link-forum:hover { - картинка в виде ссылки при наведении
height: 300px;
- строка...

...видать явно твоя глобальная проблема! bl

И маленький совет... если у тебя есть значение height: 200px; в a.link-forum {, то скажи зачем ты повторяешь код засаряя и утежеляя стиль в a.link-forum:hover {. Если значения одинаковы, не стоит копировать тоже. И относится это не тока к ширине, а ко всему и остальному тоже...

Пример приведу:

.on-forum {
vertical-align: top;
background: url(../images/on-forum.png) no-repeat;
}

a.link-forum {
display: block;
width: 235px;
height: 200px;
font-weight: bold;
color: #fc0103;
text-transform: uppercase;
text-decoration: none;
background: transparent url(../images/forum.png) no-repeat;
padding: 10px 0 0 10px;
margin: 21px 0 0 23px;
}

a.link-forum:hover {
color: #fff;
background: url(../images/forum-hover.png) no-repeat;
}


данный код реалистичен для 2-х указанных у тебя картинок одного и того же размера. Если при наведении картинка задумана более чем на ссылке, то тогда и впиши размеры в a.link-forum:hover { те что надо.
Изменил(а) Rasmusok, 21.03.2011 18:36
Разработка сайтов. Продвижение. Раскрутка. www.wooas.ru
Начхать на красоту, главное что под капотом.
 
Web
jikaka
видать явно твоя глобальная проблема!

ты видимо не совсем понял...
картинка при наведении больше по высоте, в 3-м посте я нарисовал пример...
поэтому и height: 200px; и height: 300px; - указаны...
проблема в другом, как уйти от активности оставшейся части картинки
 
Web
Rasmusok
al не как! Как указал, так и работает... Можно зафиксироват командами display, но тогда при прокрутке сайта эта картинка останется на том же месте как и была. Зато результам будет то что надо тебе.
Разработка сайтов. Продвижение. Раскрутка. www.wooas.ru
Начхать на красоту, главное что под капотом.
 
Web

Поделиться этой темой
Социальные закладки: Vkontakte Odnoklassniki Mail.ru Facebook Google Tweet This
URL:
BBcode:
HTML:

Перейти на форум:
Похожие темы
Темы Форум Ответов / Просмотров Последние сообщения
Возможно ли при помощи тестов (вопросов) проверить совместимость М и Ж?  →  Разное 0 / 184 09.08.2017 22:44
как задать класс textarea при включенном TinyMCE?  →  Темы оформления 7 версии 5 / 5386 14.11.2016 15:05
Forbidden 403 при попытке редактировать профиль  →  Ошибки, баги 2 / 2128 20.07.2016 06:10
Ошибка при регистрации  →  Ошибки, баги 49 / 22724 21.05.2016 12:48
Картинка в шапку сайта  →  Вопросы новичков 12 / 14912 18.05.2016 18:58
Тема при установке системы  →  Установка и настройка системы 5 / 2300 22.04.2016 06:16
Как "подружить" PHP Fusion и Facebook? Несовпадение кодировки при перепосте!  →  Ошибки, баги 11 / 12759 07.03.2016 11:26
Раскрывающийся и скрывающийся блок при клике по ссылке  →  Javascript, ajax, jquery 6 / 4463 06.02.2016 21:01
При добавлении вложения начинается дублирование сообщений  →  Ошибки, баги 1 / 808 26.02.2015 08:58
Список с checkbox. Как отметить дочерний ceckbox при выборе родительского?  →  Javascript, ajax, jquery 6 / 3991 08.02.2015 10:17
Топ 5 пользователей форума
Alex Alex (1,167)   Zaxap Zaxap (1,078)   Vova Vova (877)   Pisatel Pisatel (678)   util util (666)