SEO продвижение сайтов

Красивое увеличение картинки при наведении

Красивое увеличение картинки при наведении

Нужно подготовить три файла ккартинку, HTML-файл и CSS-файл.

Создаем HTML-файл index.html с кодом:

<!DOCTYPE html><html dir="ltr" lang="ru-ru">
<head>
<title>Увеличение рисунка</title>
<link href="/style.css" rel="stylesheet" type="text/css" />
</head><body>

<div class="img"><img src="/foto-1.png"></div>

</body></html>

Создаем CSS-файл style.css с кодом:

* {margin:0; padding:0;}

.img {border:1px solid #000; overflow:hidden; width:700px; margin:0 auto;}
.img img {
width:100%;
-webkit-transition:all 3s linear 0s;
-o-transition:all 3s linear 0s;
transition:all 3s linear 0s; display:block;
}

.img:hover img {
-webkit-transform:scale(1.2);
-ms-transform:scale(1.2);
transform:scale(1.2)
}

Скачать changing-picture-html.rar архив примера можно здесь.

Автор: Алехин Геннадий (11.04.2018)

Добавить комментарий


Защитный код
Обновить

Ошибки в тексте выделить и Ctrl+Enter


Расскажи о нас друзьям

Интересные статьи

Почему или резонные вопросы

Почему или резонные вопросы

Хотель бы получить ответы на такие вопросы:

  1. Почему современные технологии одновременно позволяют производить банки для пива, которые не разлагаются на свалке за 100 лет, и кузова автомобилей, которые гниют за 3-4 года?
  2. Почему лимонный сок сделан из концентрата, а средство для мытья посуды – из настоящего лимона?
  3. Почему белая нитка, которой соединены новые носки, всегда оказывается прочнее, чем нитки, из которых сделаны сами носки?
Подробнее...

Детские загадки для взрослых

murzilka m

*Загадки, которые были опубликованы в журнале "Мурзилка" 30 лет назад!!! Сегодня они не для детей точно: ))*

1. Чтобы спереди погладить, нужно сзади полизать. (Почтовая марка)

2. Кругом волоса, посредине колбаса. (Кукуруза)

3. Сверху черно внутри красно, как засунешь так прекрасно. (Галоши)

Подробнее...

Женщины о себе...

Женщина о себе - женский юмор

1. Женщина сказала - Женщина сделала! Если Женщина сказала и не сделала, значит, Женщина по-шу-ти-ла.

2. Умная девушка всегда знает, когда включить дуру.

3. Я вся такая легкая, такая воздушная, такая неземная, такая смелая, неотразимая... Короче, пьяная я сегодня!

4. Женская логика: "Лучше по-хорошему скажи, иначе я сама додумаю, хуже будет!"

5. Счастье - это когда ты ходишь в его футболке, без косметики, с нелепым хвостиком на голове и для него ты самая красивая на Земле!

6. Решила по дому мужскую работу сделать сама, легла на диван, смотрю телевизор. Тяжело, не спорю, но надо...

7. Тридцать - это те же двадцать, только более ухоженная, самостоятельная и уверенная в себе!

Подробнее...

Оставить заявку

Закрыть
Заполните фрму и отправьте нам заяку
Заполните все обязательные поля*
captcha
Перезагрузить