CODEWITHSUNDEEP
jquerycsscss-transitionsmodernizr
harley_woop
harley_woop

Reputation: 1849

CSS3/Javascript: Transitions IE support using jQuery/Modernizr

Does anyone know how I could achieve IE 7-9 support for (this in Codepen.io) button hover effect?

eg specifically:

transition-duration: 0.5s;
transition-property: all;
transition-timing-function: ease;
margin-top: 5px;

I tried this, however, margin-top will not animate. Others seem to..

What am I doing wrong?? Grateful for any help.

I have jQuery, Modernizr...

Thanks A lot

Harley

(Apologies in advance if this is a blatant duplicate, just I seem to have a particular problem)

Upvotes: 0

Views: 696

Answers (1)

adeneo
adeneo

Reputation: 318232

Your problem is this line:

$(this).animate({margin-top:'5px'},{queue:false,duration:500});

You'll either need to quote the CSS value or use camelcase:

$(this).animate({marginTop:'5px'},{queue:false,duration:500});
$(this).animate({'margin-top':'5px'},{queue:false,duration:500});

This pretty much applies to all CSS values with hyphens etc.

Upvotes: 2

Related Questions