Floating Animation

[aatmajajoshi]

Describe the feature

I'm adding a smooth floating animation to an image within a web page. This feature will give the image a gentle, continuous up-and-down motion, creating a visually appealing effect that can draw attention to the image. I find that missing in APoD image, so i have added it.

It should be implemented because

Here's how I have implemented it:

• CSS Keyframes: Define the stages of the animation using @keyframes. This will control the movement of the image over time.
• Animation Properties: Apply the animation to your image using CSS properties such as animation-name, animation-duration, animation-timing-function, and animation-iteration-count.
• Transform Property: Use the transform property within the keyframes to move the image vertically (translateY) to create the floating effect.

Additional context

Here's the implementation of the same:

https://github.com/PranavBarthwal/cosmoXplore/assets/78197261/3559c077-5234-4619-8686-4534989c6ce9

Would you like to work on this issue?

Yes