Вопрос по анимации и позиционированию

Т.З. - Имеется страница. на которой три вертикальных блока во всю высоту страницы, два крайних блока расположены таким образом, что половина ширины скрыта за границами браузера, при наведении на левый блок - он должен выезжать полностью, а остальная часть страницы сдвигаться, так что средний блок окажется справа, а правый полностью уйдет за правую границу экрана. Реализовано следующим образом и прекрасно работает:

#left {
   left: -350px;
   width: 700px;

#center {
   left: 350px;
   width: 1220px;

#right {
   left: 1550px;
   width: 700px;

#left:hover + #center {
   left: 700px;
   transition: 1s;
}

#left:hover + #center + #right {
   left: 1920px;
   transition: 1s;
}

Но как сделать так, чтобы при наведении на правый блок, средний и левый отъезжали таким же образом в другую сторону, разобраться не могу. Подобный синтаксис подразумевает то, что при наведении на первый блок изменяются последующие, а как анимировать предыдущие блоки? Шаманил как только приходило в голову - не работает. Возможно ли с помощью CSS добиться такого результата? Если нет - то возникает другой вопрос, как его решить тоже не нашёл нигде:

Как нужно задать позиционирование блоков, чтобы при движении левого или правого, остальные блоки смещались вместе с ним?

P.S. Все свойства не несущие информацию по этой конкретной задаче я не копировал. Надеюсь на помощь.

Вопрос по Komento Автор Missile	Ответов: 9 Просмотров: 4597	21.12.2022, 17:52:46 от Missile
Вопрос по CSS Joomla 3+ Автор HomoSapiens	Ответов: 8 Просмотров: 2598	02.11.2020, 16:30:48 от Verhov526
Вопрос по разметке Bootstrap 3 Автор Xzizz	Ответов: 3 Просмотров: 1916	05.01.2017, 13:43:59 от dmitry_stas
Вопрос обтекания центрированого текста относительно изображения полного текста материала Автор Barakyda	Ответов: 7 Просмотров: 2550	26.09.2016, 15:48:51 от Barakyda
Вопрос по меню CSS Автор hmarno	Ответов: 4 Просмотров: 1603	09.03.2016, 15:08:51 от Shustry

Вопрос по анимации и позиционированию - Вопросы по CSS

Новости Joomla

👩‍💻 WT Otpravkapochtaru - библиотека сервиса Отправка Почты России для Joomla-разработчиков.

👩‍💻 В Joomla 6.2 появятся встроенный функционал мультикатегорий.

👩‍💻 На Хабре вышел Joomla-дайджест за 2-й квартал 2026 года.

metalmorph

Вопрос по анимации и позиционированию

Похожие темы