Забавный факт: Клубника — единственный фрукт, у которого семена снаружи.

Вам понадобится простая HTML-страница, немного CSS для стилизации и среднее знание JavaScript. Сначала вы создадите страницу index.html, если вы вкладку doc, все необходимые элементы будут опубликованы автоматически, и это все для части HTML. Я серьезно, это все.

Далее идет CSS, т.е. для стилизации этой клубники вам понадобится класс, который вы можете назвать как угодно, я назвал его соломой и написал в нем эти свойства.

Сейчас я не буду вдаваться в подробности всех этих отдельных свойств, а только небольшие сложные, такие как Transform, которые позволяют вам вращать, масштабировать, перемещать элементы и т. д. Анимация: давайте элемент постепенно изменится от одного стиля к другому, в этом случае он задал направление падения за 3 секунды. Но чтобы использовать любую CSS-анимацию, нам нужен KeyFrame, подобный этому:

Ключевые кадры содержат стили, которые элемент будет иметь в определенное время. Vh — это единица измерения css, обозначающая высоту области просмотра. Эта единица измерения основана на высоте окна просмотра. Значение 1vh равно 1% высоты области просмотра.

Закончили с частью CSS, переходим к промежуточному разделу JAVASCRIPT!!! Вам нужно будет создать функцию, и в этой функции вы можете создать div element да, вы не ослышались div также можно создать в JS и присвоить переменной. Нравится:

Const используется для объявления Straw, но не определяет постоянное значение. Он определяет постоянную ссылку на значение. Свойство classlist полезно для добавления, удаления и переключения классов CSS для элемента, здесь мы добавляем «.Straw».

Хорошо, хорошо, не волнуйтесь, это простая математическая функция, используемая здесь в JS для стиля и фиксированная продолжительность для этого стиля. Math.random() возвращает случайное число от 0 до 1. Свойство AnimationDuration определяет, сколько секунд или миллисекунд требуется анимации для завершения одного цикла.

Метод setTimeout() вызывает функцию или оценивает выражение через указанное количество миллисекунд, например 1000 мс = 1 секунда. Здесь через 5 секунд анимация или вы можете сказать, что клубника будет удалена, и в последнем разделе мы дали интервал для появления клубники через определенное время, чтобы они не перекрывались.

ВОТ ЭТО, теперь у нас идет клубничный дождь!

Для Strawberry или других вещей просто загуглите смайлики Strawberry, а затем скопируйте и вставьте их в эти плохие парни «🍓».