CoderslangJS

Let’s practice transitions of css property values. For div.box element, the following changes should occur on hover: width should be 400px, transition delay 1s, duration - 4s; height should be 400px, transition delay is 2s, duration - 4s; the corners should become 50% rounded, transition delay 2s, duration - 4s; background color should be #861657, transition delay should not be, duration should be 4s....

Let’s add a simple animation. In it, the circle should move infinitely along the corners of the square. Let’s do a little preparation before the animation. One animation cycle of a div....

Now let’s describe our circleMove animation in a keyframe. The starting position has already been specified. After a quarter of the time, the circle should move to the upper right corner....

Let’s animate the flipping of the card We’ll do some preparation at the first step. Firstly, the back of the map (.face.back) must be rotated 180 degrees around the Y axis...

We will turn the card over with trickery. If we just turn it over, it will sort of pop out a little ahead. To avoid this, we need to shift the center of the perspective to the right of the card element....

You’ve probably watched the Star Wars movies. Now I will try to create this animation for the first episode. First of all, let’s prepare the markup for our page. Inside the body, add a div with class star-wars, inside it, add a div with class episode-intro....

Now let’s add the stylesheet. The body tag should occupy the entire screen of the device, and everything beyond the body should be hidden. Use the only picture from the images folder for the background body....

Now let’s add the stylesheet. The body tag should occupy the entire screen of the device, and everything beyond the body should be hidden. Use the only picture from the images folder for the background body....

Build Your First React Native App with Expo. The application must be named my_app. Do not change anything in the files of the created application - just send it for review....

Go to App.js file. There is a Text element. Change the inner text of this document to My first React Native try. This task is part of the Full-Stack JavaScript Course...