О сайте | Обратная связь | Памятка для вебмастера
[ Регистрация · Войти · Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Модератор форума: Anka_kuşu, Souteneur  
Форум » Создание сайта » Ucoz » Код затемнения картинки при наведении курсора (Код затемнения картинки при наведении курсора)
Код затемнения картинки при наведении курсора
Nicki-Jones Дата: Воскресенье, 24.03.2013, 23:40 | Сообщение # 1
Выпускной класс
Группа: Проверенные
Сообщений: 102
Город: Магнитогорск
Репутация: 0
Статус: Offline
На многих сайтах видел такую фишку. Баннер слегка затемненный, а когда наводишь курсор он становится светлее. Работал с шаблонами и видел, что эта картинка состоит из банера, и на этой же картинке ниже баннер затемненный. Картинку я такую сделаю без проблем. А вот сам код подскажите как сделать? очень нужно. Заранее спасибо!



Не пускайте детей в интернет, интернет от детей тупеет...
KorniloFF Дата: Понедельник, 25.03.2013, 10:33 | Сообщение # 2
Профессор(ша)
Награды: 27
Группа: Администраторы
Сообщений: 3514
Город: Ялта
Репутация: 251
Статус: Offline
Nicki-Jones, вы видели вариант использования ксс-спрайтов. На этом сайте есть одноименная статья в разделе Обучение.
Но я вам мог бы предложить и другой вариант, использовать любую картинку и ксс.
Выглядет это так:
Код
<style>
#test_pict img{opacity:.6;}
#test_pict:hover img{opacity:1;}
</style>
<a id="test_pict" ><img src="http://otlichnica.com/calculators/Calculator-icon-1-.png"></a>

Пример работы:





Z146965124780
R374477004237
Ну, или хотя бы добавьте в репутацию.
Nicki-Jones Дата: Понедельник, 25.03.2013, 19:52 | Сообщение # 3
Выпускной класс
Группа: Проверенные
Сообщений: 102
Город: Магнитогорск
Репутация: 0
Статус: Offline
А в КСС что добавлять нужно?

Добавлено (25.03.2013, 19:47)
---------------------------------------------
А все, в ксс ничего не надо, так работает. Подскажите еще тогда, как ссылку добавить? что бы навел, "загорелась", а при нажатии на страницу переходить?

Добавлено (25.03.2013, 19:52)
---------------------------------------------
и еще вопрос не в тему, http://masterphoto.do.am/index/o_nas/0-5 внизу, в подвале, где надпись "поделиться" и иконка контакта, и дальше картинка в подвале идет. Как расстояние между ячейкой "поделиться" и этой картинкой уменьшить? что бы высота немного уменьшилась. А то такое большое расстояние неоправданное. В КСС искал параметры, не нашел. Что то похожее находил, менял, но тогда весь подвал сьезжал. Заранее спасибо




Не пускайте детей в интернет, интернет от детей тупеет...
KorniloFF Дата: Понедельник, 25.03.2013, 20:17 | Сообщение # 4
Профессор(ша)
Награды: 27
Группа: Администраторы
Сообщений: 3514
Город: Ялта
Репутация: 251
Статус: Offline
Цитата (Nicki-Jones)
А все, в ксс ничего не надо, так работает. Подскажите еще тогда, как ссылку добавить? что бы навел, "загорелась", а при нажатии на страницу переходить?

Цитата

<style>
#test_pict img{opacity:.6;}
#test_pict:hover img{opacity:1;}
</style>
<a id="test_pict" href="ссылка"><img src="http://otlichnica.com/calculators/Calculator-icon-1-.png"></a>


Цитата (Nicki-Jones)
и еще вопрос не в тему

1. Пишите в тему
2. Иллюстрируйте скринами, по тексту сложно разобраться.




Z146965124780
R374477004237
Ну, или хотя бы добавьте в репутацию.
Форум » Создание сайта » Ucoz » Код затемнения картинки при наведении курсора (Код затемнения картинки при наведении курсора)
  • Страница 1 из 1
  • 1
Поиск:
Код затемнения картинки при наведении курсора - Создание сайта - Ucoz - Форум при наведении курсора на картинку картинка темнеет
Сегодня были на форуме:
viktorbilenku

Конструктор кнопок он-лайн


Получить код CSS

Подбор цветов

Справочник по html и CSS

Наши копирайтеры

Поиск