Weboldal keresés

javascript - Amikor CSS átmeneteket/animációkat/stb. használunk, mi a legjobb módja annak, hogy a jQuery-re váltsunk, ha a felhasználó böngészője nem támogatja a CSS animációkat?


Olyan módot keresek a CSS animációk használatára, hogy ha a felhasználó böngészője nem támogatja a CSS animációkat, akkor a Jquery-t használhassam animációra. Van erre könnyű mód Jquery-ben? Egy plugin is rendben lenne, ha kicsi lenne, de valójában valamiféle módszert keresek ennek Jquery-ben történő megvalósítására, ha lehetséges. Az egyetlen oka annak, hogy CSS animációkat akarok használni, az a sokkal alacsonyabb processzorhasználat, amit a CSS animációk használnak.

Válasz #1

A jQuery animate kiegészítő bővítmény CSS átmeneteket használ anélkül, hogy kifejezett kódot kellene írni az átmeneteket támogató böngészőkhöz

Az alternatíva nem túl bíztató: hozzáadhatnál egy funkciófelismerő könyvtárat, például a Modernizr-t, majd minden esetre külön kódot írhatnál, például...

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
}

Válasz #2

Nem kell törődnöd vele. Az animációk nem létfontosságúak. Ha progresszív fejlesztést alkalmazol, minden felhasználó megkapja a lehető legjobb élményt, amit a böngészője enged :).

Ha ennyire törődsz azzal a "processzor teljesítménnyel", egyáltalán nem akarod az animációkat az IE-n. Ellenkező esetben használd csak a jQuery-t, az tűnik a legjobbnak a te különleges igényeidhez.