Hi guys
I’m new to css animations and these kind of effects in general. I’m trying to peice together a button effect that I’ve seen on the Dyson website. If you hover over the choose model button (top right)
https://www.dyson.co.uk/sticks/dyson-cyclone-v10-overview.html
Its got a nice growing circle effect.
I’ve cobbled this together from their code but its not working. I don’t think I’m far off.
Here’s my pen: https://codepen.io/qwerty-design/pen/QmLyqB?editors=1100
As a final note the dev team at Dyson have loads of properties on their buttons I just wondered if these are necessary?
.button {
-webkit-transform:translateZ(0);
vertical-align:middle;
cursor:pointer;
-moz-appearance:none;
-webkit-appearance:none;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
background-clip:padding-box;
-moz-osx-font-smoothing:grayscale;
}