javascript - Når man bruger CSS-overgange/animationer/osv., hvad er den bedste måde at falde tilbage til jQuery, hvis brugerens browser ikke understøtter CSS-animationer?


Jeg leder efter en måde at bruge CSS-animationer på, men hvis brugerens browser ikke understøtter CSS-animationer - så at falde tilbage til at bruge jQuery til animationen. Findes der en nem måde at gøre dette i jQuery? En plugin ville være OK, hvis det var en lille plugin, men jeg leder virkelig efter en måde at gøre dette i jQuery, hvis det er muligt. Den eneste grund til, at jeg vil bruge CSS-animationer, er på grund af den meget lavere processorbelastning, der bruges ved CSS-animationer.

Svar #1

jQuery animate-udvidelsespluginet bruger CSS-overgange uden at skulle skrive specifik kode til browsere, der understøtter overgange

Alternativet er ikke særlig opmuntrende: du kunne tilføje et funktionsdetektionsbibliotek som Modernizr og derefter skrive specifik kode for hver situation, såsom...

if (Modernizr.csstransitions) {
  $("#yourdiv").css({
    "-webkit-transform" : "translate(0, 10)",
    "-o-transform" : "translate(0, 10)",
    "-moz-transform" : "translate(0, 10)",
    "-ms-transform" : "translate(0, 10)",
    "transform" : "translate(0, 10)"
});
}
else {
  //do jquery animate stuff
}

Svar #2

Du bør ikke bekymre dig om det. Animationer er ikke vitale. Hvis du laver progressiv forbedring, vil hver bruger få den bedste oplevelse, deres browser tillader dem at have :)

Hvis du går så meget op i den "processor kraft", vil du slet ikke have animationer i IE. Ellers kan du bare bruge jQuery, det ser ud til at være bedst til dine særlige behov.