Как реализован эффект внутри картинки

SergF

Сообщений: 235 Регистрация: Янв 2014

7 Октября 2018 23:22

Вот пример _yadrenakopot.ru начать бесконечный пикник кнопка внизу, картинка увеличивается, как это работает?

sharkson

Сообщений: 5425 Регистрация: Янв 2014

8 Октября 2018 20:37

Код

<div class="section__container">

    <canvas id="zooming" class="home-view__zooming" width="1680" height="419"></canvas>
    <button id="startZoom" class="home-view__start"></button>
    <div class="home-view__keyboard"></div>

</div>

Посмотрите отладичиком css свойства элементов и почитайте _http://htmlbook.ru/css/transform

НАДЕЖНЫЙ И НЕДОРОГОЙ ХОСТИНГ ТУТ
НЕДОРОГОЙ ХОСТИНГ
ПРОДАМ БЛОГ ЖЖ
СОЗДАНИЕ И НАСТРОЙКА MediaWiki и phpbb3

SergF

Сообщений: 235 Регистрация: Янв 2014

8 Октября 2018 23:01

sharkson, смотрел отладчиком, если сделать изображению transform: scale(5) оно станет не четким, там картинка как заглушка после клика работает canvas. Вот я хочу узнать как это действует.

c00x Сообщений: 22 Регистрация: Сен 2018	#4 9 Октября 2018 04:36 SergF, там 30 картинок. Каждая следующая картинка - приближенная, детализированная часть предыдущей. Первая картинка зумится и подменяется на вторую, и т.д. Погуглите "zoomquilt" - на хабре когда-то статья была, как такое создавать.

Новые темы	Объявления	Свободное общение
19:29 Dao.AD: Монетизация и покупка Push/Pops/Inpage и Video трафика! 17:29 Как продвигать сайт с неуникальным контентом 14:50 Индексация страниц 12:36 У кого новостник, дайте пару советов плиз 13:53 AviTool - мощный инструмент для автоматизации работы с Avito 17:01 Absence в Армении 23:19 Ребята подскажите какими сервисами и прогами вы пользуетесь для SEO продвижения?	15:31 PonyBit.ru - обменный пункт PonyBit.ru (Понибит.ру) 13:09 swapsfera.com 13:08 garantcoin.io - быстрый и надёжный сервис обмена криптовалюты GarantCoin 12:31 GoodsMoney.io 12:26 Разработка сайта, интернет-магазина, каталога на Joomla 5 и выше – опыт с 2009 года. 11:13 Telegram Bot автопродаж Google Voice , Old USA Gmail 2006 - 2016. 11:13 SpaceSwap.cc - Быстрый и надежный обменник криптовалют	23:07 Ну что, кто куда деваете свои сайты? 19:30 Добро пожаловать в цифровой мир... 19:42 Топ-5 способов использовать мобильные прокси для бизнеса: подробный обзор 22:08 Накрутка поисковых подсказок 05:04 Точные прогнозы на футбол 14:01 Union Pharm - топовая фарма-партнерка для профессионалов! 10:59 Ням-ням! - 8 деликатесов, которые когда-то ели только бедные люди

Новые темы

Объявления

Свободное общение

19:29 Dao.AD: Монетизация и покупка Push/Pops/Inpage и Video трафика!
17:29 Как продвигать сайт с неуникальным контентом
14:50 Индексация страниц
12:36 У кого новостник, дайте пару советов плиз
13:53 AviTool - мощный инструмент для автоматизации работы с Avito
17:01 Absence в Армении
23:19 Ребята подскажите какими сервисами и прогами вы пользуетесь для SEO продвижения?

15:31 PonyBit.ru - обменный пункт PonyBit.ru (Понибит.ру)
13:09 swapsfera.com
13:08 garantcoin.io - быстрый и надёжный сервис обмена криптовалюты GarantCoin
12:31 GoodsMoney.io
12:26 Разработка сайта, интернет-магазина, каталога на Joomla 5 и выше – опыт с 2009 года.
11:13 Telegram Bot автопродаж Google Voice , Old USA Gmail 2006 - 2016.
11:13 SpaceSwap.cc - Быстрый и надежный обменник криптовалют

23:07 Ну что, кто куда деваете свои сайты?
19:30 Добро пожаловать в цифровой мир...
19:42 Топ-5 способов использовать мобильные прокси для бизнеса: подробный обзор
22:08 Накрутка поисковых подсказок
05:04 Точные прогнозы на футбол
14:01 Union Pharm - топовая фарма-партнерка для профессионалов!
10:59 Ням-ням! - 8 деликатесов, которые когда-то ели только бедные люди

29.06.2024 22:50	Обучение созданию сайтов на Tilda за один день: быстро и эффективно
28.09.2016 15:51	Интересный эффект, как сделать ?
19.01.2014 21:44	Подскажите как добавить эффект на слайдер!