Tes Dukungan CSS Transisi pada Peramban

Tabel Konten
  1. Penggunaan 
// 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);
}

7 Komentar

  • budkalon

    Ini dia yang saya inginkan! Selama ini saya terus saja mendambakan peramban dapat secara otomatis mendeteksi apakah dia mendukung css atau tidak, dan bila tidak akan dialihkan ke dalam js. terima kasih :)

  • Unknown

    Fallback yg bagus JS mmg cocok, tapi semua kode saling bergantungan :) kalau gak bisa ini pake itu, :D

  • Unknown

    tutor ini untuk apa ya bang

  • Unknown

    sangat menarik..

  • Unknown

    wait

  • ÷4-p-5-c-0-d-3÷

    [INFO:.
    Semenjak April Domain Web.id sering menjadi sasaran Cyber Myanmar ada sekitar 150 website yg sdh mereka Deface klu tahu solusi share ke Para Blogger dengan domain yg sama.

    Thx Sebelumnya Mas]

    • Anonim

      masa sih...

Komentar telah ditutup.