Страница 1 из 11
Форум про uCoz » Раздел uCoz » Скрипты и коды uCoz » Замена изображение при наведении на него курсора
Замена изображение при наведении на него курсора
workman
Дата: Воскресенье, 03.01.2016, 18:28 | Сообщение # 1
Vip
Сообщений:1576
Награды: 7


Всё просто. Код состоит из двух частей

Код
<div class="img_zamena"></div>
css для этого дива который будет отвечать за замену изображения при наведении
Код
.img_zamena {
  background: url("картинка1.jpg") no-repeat; /* изображение по умолчанию */
  height: 120px; /* высота изображения */
  width: 120px; /* ширина изображения */
}
.img_zamena:hover {
  background: url("картинка2.jpg") no-repeat; /* новое изображение */
  border: 2px solid #f00; // Установил красную рамку
  height: 120px; /* высота изображения */
  width: 120px; /* ширина изображения */
}


Каждый раз, когда ты можешь помочь кому-то, просто сделай это и радуйся тому, что Бог отвечает на чьи-то молитвы через тебя...
Kosten
Дата: Воскресенье, 03.01.2016, 19:05 | Сообщение # 2
Администраторы
Сообщений:12668
Награды: 39


workman, но .img_zamena этот класс и будет показывать изображение, которое находится в стилях будет.

workman
Дата: Воскресенье, 03.01.2016, 19:35 | Сообщение # 3
Vip
Сообщений:1576
Награды: 7


Цитата Kosten ()
этот класс и будет показывать изображение, которое находится в стилях будет

Но при наведении на картинку мышкой оно поменяется на указанное в hover


Каждый раз, когда ты можешь помочь кому-то, просто сделай это и радуйся тому, что Бог отвечает на чьи-то молитвы через тебя...
nikolla76
Дата: Воскресенье, 03.01.2016, 23:45 | Сообщение # 4
Пользователи
Сообщений:32
Награды: 0


workman, но это простое увеличение, которое на форуме работать не будет.
Kosten
Дата: Понедельник, 04.01.2016, 00:31 | Сообщение # 5
Администраторы
Сообщений:12668
Награды: 39


nikolla76, но для этого есть совершенно другие модули, на одном форуме не все сидят, так как там только BB коды работают, хотя нет, а как к примеру полный код плеера от ютуб можно поставить и он показывает.

workman
Дата: Понедельник, 04.01.2016, 00:49 | Сообщение # 6
Vip
Сообщений:1576
Награды: 7


Цитата nikolla76 ()
но это простое увеличение, которое на форуме работать не будет

Вы так думаете? Нет ошибаетесь.Видимо вы не понимаете в стилях и кодах ничего ... Где вы увидели тут в коде увеличение то???


Каждый раз, когда ты можешь помочь кому-то, просто сделай это и радуйся тому, что Бог отвечает на чьи-то молитвы через тебя...
FeStemBer
Дата: Понедельник, 04.01.2016, 00:56 | Сообщение # 7
Проверенные
Сообщений:294
Награды: 1


Цитата workman ()
Где вы увидели тут в коде увеличение то


Как понимаю, это исходные размеры, которые вы сами выставите.

Код
height: 120px; /* высота изображения */
  width: 120px; /* ширина изображения */
Траст
Дата: Понедельник, 04.01.2016, 01:08 | Сообщение # 8
Пользователи
Сообщений:91
Награды: 0


Кто не понял, немного лекций, будет изночальное изображение, которое исходить будет от стилей. Вы на его наводите и оно изменяется, может стать больше или прокрутиться на месте.

Быстро, дешево и сердито!
workman
Дата: Понедельник, 04.01.2016, 08:52 | Сообщение # 9
Vip
Сообщений:1576
Награды: 7


Чтобы было более разборчиво как данное работает, пришлось малость заморочиться и создать ДЕМО страничку в которой можно посмотреть как работает данные стили

Каждый раз, когда ты можешь помочь кому-то, просто сделай это и радуйся тому, что Бог отвечает на чьи-то молитвы через тебя...
Форум про uCoz » Раздел uCoz » Скрипты и коды uCoz » Замена изображение при наведении на него курсора
Страница 1 из 11
Поиск: