Event Touch di HTML5 - Purwana Tekno, Software Engineer
    Media Belajar membuat Software Aplikasi, Website, Game, & Multimedia untuk Pemula...

Post Top Ad

Rabu, 13 Desember 2017

Event Touch di HTML5

Berikut ini adalah contoh kode penulisan untuk menguji Touch Event pada HTML5

Style:

<style>
#output {
    font-size: xx-large;
    text-align: center;
    color: red;
    width: 300px; height: 100px; background-color: yellow;
}
</style>

Kode Javascript:

<script>
document.addEventListener('touchstart', function(event) {
    var output = document.getElementById('output');
    output.innerHTML = event.touches.length + " Tekan";
});
</script>

Kode HTML:

<div id="output"></div>
Silakan Tekan / sentuh di layar device untuk melihat hasil touch event (HTML5).

Antarmuka acara sentuhan adalah API tingkat rendah yang dapat digunakan untuk mendukung interaksi multi-sentuhan aplikasi tertentu seperti isyarat dua jari. Interaksi multi-sentuh dimulai saat jari (atau stylus) menyentuh permukaan kontak. Jari lainnya kemudian menyentuh permukaan dan secara opsional bergerak melintasi permukaan sentuh. Interaksi berakhir saat jari-jari dikeluarkan dari permukaan. Selama interaksi ini, aplikasi menerima peristiwa sentuhan selama fase awal, perpindahan dan akhir.

Peristiwa sentuh mirip dengan acara mouse kecuali mereka mendukung sentuhan serentak dan di lokasi yang berbeda pada permukaan sentuh. Antarmuka TouchEvent merangkum semua titik sentuh yang saat ini aktif. Antarmuka Sentuh, yang mewakili satu titik sentuh, mencakup informasi seperti posisi titik sentuh relatif terhadap area pandang browser.

Post Top Ad