Приветствую! Подскажите новичку про баннеры с увеличивающейся картинкой при наведении. Помещаем картинку в блок, задаем одинаковый с блоком размер, в ховер картинки записываем больший размер, ограничиваем увеличение блока overflow- hidden. Все работает, НО фокус получается не по центру картинки, а по верхнему левому краю картинки. Кто понял всю эту написанную лабуду, как простым способом сделать, чтобы картинка увеличивалась по центру?
Увеличивающаяся картинка
Увеличивающаяся картинка, как сверстать
|
#1
17 Марта 2018 13:21
|
|
#2
17 Марта 2018 14:06
В гугл смотрим: "картинка увеличивалась по центру css3"
|
|
#3
17 Марта 2018 14:30
|
|
#4
17 Марта 2018 14:40
.new {
width:230px;height:180px;border: 7px solid #7F7F7F;overflow: hidden;margin:0 auto; } .new img {width:100%;height:180px;transition:2s;} .new img:hover {width:120%;height:215px;} В хтмл блок с классом new |
|
#5
17 Марта 2018 14:52
Раньше искал в яндексе и как-то не нашел результата, может вопрос неверно формулировал. Щас в гугле сразу нашел, вместо увеличенного размера нужно указывать
transform: scale(1.1); спасибо! |
||||
Похожие темы:
| 07.06.2018 18:19 | Верстка, что бы картинка не закрывала рамку |
| 21.02.2018 22:41 | Статистическая страница с картинками в дле |
| 10.01.2018 22:44 | Подгружается ли картинка в background |
| 11.08.2016 16:42 | Как сделать чтобы картинка не растягивалась? |
| 05.10.2013 01:12 | Съезжает картинка-лого ПП (cityads) |
Читают тему (гостей: 1, пользователей: 0, из них скрытых: 0)
Апдейты
- Яндекс ИКС
23.11.2023 (417 дней назад) - Яндекс выдача
05.09.2024 (130 дней назад)
Доска объявлений
Купить / Продать
Работа / Услуги
Интересные темы
Интернет новости
Инструменты