Как я могу замаскировать div с прозрачным под ним?

  • Автор темы fiestroo
  • 22
  • Обновлено
  • 17, May 2024
  • #1
У меня есть контейнер div (который может находиться в центре страницы). Я хочу анимировать еще один div (того же размера) от левого края до верха контейнера div. Это легко. Мне нужно, чтобы анимированный div был невидимым, за исключением размеров контейнера div. Таким образом, вы можете видеть всю страницу, включая контейнер div, но правый край анимированного div находится слева от левого края контейнера div. И НЕВИДИМЫЙ.

Мне нужно переместить анимированный div вправо до тех пор, пока левый край анимированного div не станет равным левому краю контейнера div и не станет видимым.

Когда он движется вправо, мне нужно, чтобы часть анимированного div, находящаяся внутри div-контейнера, была видимой, а все, что находится за пределами div-контейнера, было невидимым.

В конце анимации анимированный элемент div полностью находится внутри контейнера и становится видимым. Я продолжаю смотреть на маску и клип CSS, но пока не могу этого понять.
Помощь?

fiestroo


Рег
05 Apr, 2014

Тем
1

Постов
1

Баллов
11
  • 12, Jun 2024
  • #2
Я бы предложил притвориться. По сути, вам нужно переполнение в обратном порядке, а это не так. Я бы сделал фон контейнера div непрозрачным, но имитировал бы то, что было бы под ним. Конечно, если под ним находится обычное содержимое страницы, это может оказаться нежизнеспособным.
 

magaga


Рег
18 May, 2015

Тем
0

Постов
3

Баллов
3
Тем
49554
Комментарии
57426
Опыт
552966

Интересно