- This topic is empty.
October 4, 2013 at 5:34 am #152019
I think it may have something to do with a pseudo element, but I’m not sure. I am having difficulties with the effect of a transform transition using css3. In Firefox v24, the effect works as I want it to – see the codepen here http://codepen.io/patrickwc/pen/aKEec but in Chrome and IE, the border effect of the links animate and then suddenly switch back into position. It is difficult to describe so the best way is to look at the effect in Firefox then in Chrome or IE.
I put the relevant section right at the bottom of the scss pane, if I make the width the same as the previous width it is animating from (20px) it works fine, but if I make it a bit larger, which is how I want it to work across all browsers, the lines animate but then jump back in IE/Chrome. Pretty annoying!
Any help or explanation as to the difference would be greatly appreciated.October 4, 2013 at 7:20 am #152030
Excellent, thanks a lot. I fiddled around with the margin left and margin right properties and made the width a bit larger (85%, ml 5% and mr 10%) and now its perfect in IE too. Codepen doesn’t seem to work in the latest IE on Windows 7 for me.
This is from the excellent codrops site, for anyone who likes the effect check them out: http://tympanus.net/Development/CreativeLinkEffects/October 8, 2013 at 9:24 am #152343
- The forum ‘CSS’ is closed to new topics and replies.