Technology

マルチタッチ検出

投稿日:2020年2月4日 更新日:

スマートフォン, タブレットなどタッチイベントを検出します。

DEMO

window.addEventListener('load', (event) => {
    let e: HTMLElement | null = document.querySelector('#canvas-wrapper canvas');

    ["touchstart", "touchmove", "touchend"].forEach((type: any) => {
        if (!e) return;
        e.addEventListener(type, (event: TouchEvent) => {
            event.preventDefault();
            let e: HTMLElement | null = document.querySelector('#info');
            let s: string = '';
    
            if(!e) return;
    
            e.innerHTML = '';
            for (var i = 0; i < event.touches.length; i++) {
                var t = event.touches[i];
                s += "[" + i + "]";
                s += "x=" + t.pageX + ",";
                s += "y=" + t.pageY + "<br>";
            }
            e.innerHTML = s;
        }, { passive: false });
    })
})

-Technology
-,

執筆者:

関連記事

cactiのトラブル

1.2.10 インストールが41%から進まない Cacti_Stats.xml.gz が壊れているので置き換える。 This was due to a damaged Cacti_Stats pack …

node.jsの最大メモリを増やす

node.jsの最大メモリは2GBです。メモリ不足でWebpackのビルドが落ちることがあります。 FATAL ERROR: Ineffective mark-compacts near heap l …

Powershellを利用してFirefoxをダウンロードしてインストールする

PowerShell3.0 で導入された Invoke-WebRequest を利用してFirefoxをダウンロードします。Start-Process に -Verb RunAs をつけるこ …

cURLでWebDAV

Basic認証でファイルのダウンロード curl –user name:password -X GET -O –url https://example.com/path/to/filename.t …

Raspberry Pi 4 を 外部ストレージで起動する。OSはCentOS8

CentoOS8 Raspberry Pi 4用イメージをダウンロード https://people.centos.org/pgreco/CentOS-Userland-8-stream-aarch6 …