// http://stackoverflow.com/questions/7264899/detect-css-transitions-using-javascript-and-without-modernizr/13081497#13081497
var supportCSSTransitions = (function() {
var s = document.createElement('p').style;
return 'transition' in s ||
'WebkitTransition' in s ||
'MozTransition' in s ||
'msTransition' in s ||
'OTransition' in s;
})();Penggunaan
Menambahkan kelas spesifik pada tag <html> berdasarkan dukungan CSS transisi pada peramban yang dipakai:
document.documentElement.className +=
supportCSSTransitions ? " css-transition" : " no-css-transition";Menggunakan animasi CSS transisi untuk performa yang lebih baik jika peramban yang dipakai mendukung CSS transisi, dan akan dialihkan ke JQuery .animate() jika peramban yang dipakai tidak mendukung CSS transisi:
if (supportCSSTransitions) {
$('div').css({
"top": 50,
"left": 100
});
} else {
$('div').animate({
"top": 50,
"left": 100
}, 1000);
}
0 komentar:
Posting Komentar