I need bounce animation with css. It will look like same as bounce effect in powerpoint 365. Object will bounce like a ball from left side to right
Asked
Active
Viewed 91 times
-5
-
You can use [Animate.css](https://daneden.github.io/animate.css/) – Nick Dec 17 '18 at 07:14
-
no. i need custom css to create this effect – Sarabjit Singh Dec 17 '18 at 07:41
-
`animate.css` is opensource, just copy code – Nick Dec 17 '18 at 07:45
-
have not same effect as i need – Sarabjit Singh Dec 17 '18 at 07:49
1 Answers
1
I believe that you could achieve this with a complex, but do-able keyframes
animation. With an on:hover
set like this: element1:hover {animation: name | duration | ease-type | iteration-count;}
In case you are unfamiliar with '@keyframes', you work with percents of an animation phase. A similar effect has been made with this Code Pen or you can look at keyframes in depth with either w3schools or Mozilla CDN
I hope this was helpful in your endeavors. 😁

marc_s
- 732,580
- 175
- 1,330
- 1,459

Jordan Dunton
- 171
- 2
- 10
-
I appreciate your answer, but it is not that i actually want. Please go through powerpoint 365 bounce effect, in which object bounce and move left to right smoothly. – Sarabjit Singh Dec 18 '18 at 04:00
-
Hey, it has been a while, if you have not found an answer yet, I think I have a method that could get the effect. The animation platform Green Sock is really robust in its animations. Read up on it, if you haven't before. (You'll have to pay if you are developing a site to be posted online with purchases. – Jordan Dunton Jan 08 '19 at 00:59
-
Although, if you have NO basic knowledge of JavaScript/ JQuery, you can watch their really helpful tutorials on YouTube. – Jordan Dunton Jan 08 '19 at 01:00