<!DOCTYPE html> <html> <head> <style> div{ position:relative; transition-property:top; -webkit-transition-property:top; /* for safari */ top:0px; transition-duration:2s; -webkit-transition-duration:2s; /* for safari */ transition-timing-function:ease-in; -webkit-transition-timing-function:ease-in; /* for safari */ } div:hover{ top:100px; } </style> </head> <body> <div> <p>The animation-timing-function is ease-in. The text moves smoothly with this property. The text moves smoothly at the start.</p> </div> </body> </html>
Run
×
Share