Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 22.12.2018, 14:18   #1
architec
Новичок
Джуниор
 
Регистрация: 22.12.2018
Сообщений: 1
Вопрос Режим Cover у background

Есть на странице 4 изображения, размещенные по углам.
2018-12-22_14-02-46.jpg
Хочу добиться размещения всех картинок по углам. Сделать это не сложно.
Но вот на больших экранах картинки маленькие, на малых наоборот большие. А если экран портретный, то вообще картинки друг на друге...
Хорошо бы добиться примерно вот такого результата: http://gaze.tommusdemos.wpengine.com...tartup-tokyo/#

Т.е. не зависимо от размеров экрана, картинки всегда примерно по углам и масштабируются в зависимости от размеров и положения экрана.
Если эти картинки склеить в одно изображение в виде фонового и поставить cover для background, то все получается неплохо...

Причем картинки явно не только масштабируются, но и пропорционально смещаются от центра страницы...
Намучился с этим вопросом прилично! Но так и не смог реализовать пример по первой ссылке... И речь даже не про анимацию, а именно расположение картинок и их масштабирование.
Можно ли реализовать такой эффект на css или JS?

Последний раз редактировалось architec; 22.12.2018 в 14:33.
architec вне форума Ответить с цитированием
Старый 04.01.2019, 21:54   #2
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Цитата:
Сообщение от architec Посмотреть сообщение
Можно ли реализовать такой эффект на css или JS?
Можно. Если через CSS, то смотри в сторону media-query и animate-keyframes. Если в JS — опять же media-query и какой-нибудь animate. Можно взять из jQuery или GSAP. Я обычно сам пишу. Для большинства браузеров лучше CSS-решение, для IE & edge лучше JS.
Alar, верни репу!
Naive вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
1px cover Green4el HTML и CSS 1 16.10.2013 22:27
Не получается использовать "background" и "background-color" одновременно. shavedcat HTML и CSS 10 17.11.2012 21:04
background pavelslap HTML и CSS 2 14.01.2012 03:44
background onclick pavelslap HTML и CSS 2 11.05.2011 00:02
CSS Background bill HTML и CSS 1 28.10.2010 22:03