5

The CSS I am using is like this: I am not understanding the difference between @keyframes and @webkit-keyframes. 

@keyframes slideDown {
    0% {
      transform: translateY(-100%);
    }
    100% {
      transform: translateY(0%);
    }  
  }
  
  @-webkit-keyframes slideDown {
    0% {
      -webkit-transform: translateY(-100%);
    }
   
    100% {
      -webkit-transform: translateY(0%);
    } 
}
Pranil Deshmukh
  • 59
  • 1
  • 2
  • 1
    Actually you only need the first one ... and the webkit version is the a vendor prefixes used for support cases, search about it and you will get more information https://www.lifewire.com/css-vendor-prefixes-3466867 – Temani Afif Aug 25 '18 at 08:09
  • duplicate of : https://stackoverflow.com/questions/25110510/why-doesnt-css-feature-work-in-browser-but-works-in-others?noredirect=1&lq=1 – Temani Afif Aug 25 '18 at 08:10
  • Okay got it. Thanks – Pranil Deshmukh Sep 05 '18 at 13:23

1 Answers1

7

Whenever you add a "@webkit" prefix , you basically are allowing support for chrome browser to render animation.

Refer this

damini purohit
  • 71
  • 1
  • 3