MediaWiki:Common.js: Unterschied zwischen den Versionen
Aus Infopedia
(Die Seite wurde neu angelegt: „→Das folgende JavaScript wird für alle Benutzer geladen.: function watchForHover() { var lastTouchTime = 0; var isTouched = false; var timer = null…“) |
|||
Zeile 1: | Zeile 1: | ||
/* Das folgende JavaScript wird für alle Benutzer geladen. */ | /* Das folgende JavaScript wird für alle Benutzer geladen. */ | ||
− | + | var lastTouchTime = 0; | |
− | + | var isTouched = false; | |
− | + | var timer = null;; | |
− | + | var touchduration = 500; | |
− | |||
− | + | function mousemove_event() { | |
− | + | if (isTouched || (new Date() - lastTouchTime < 500)) return; | |
− | + | document.body.classList.add('hasHover'); | |
+ | } | ||
+ | |||
+ | function touchstart_event() { | ||
+ | isTouched = true; | ||
+ | document.body.classList.remove('hasHover'); | ||
+ | } | ||
+ | |||
+ | function touchend_event() { | ||
+ | isTouched = false; | ||
+ | lastTouchTime = new Date(); | ||
+ | document.body.classList.remove('hasHover'); | ||
+ | } | ||
+ | |||
+ | document.addEventListener('touchstart', touchstart_event, true); | ||
+ | document.addEventListener('touchend', touchend_event, true); | ||
+ | document.addEventListener('mousemove', mousemove_event, true); | ||
+ | |||
+ | mousemove_event(); | ||
+ | |||
+ | function touchstart_element_event() { | ||
+ | this.classList.add('touchDevice-hovered'); | ||
+ | if (!timer) { | ||
+ | timer = setTimeout(onlongtouch.bind(this), touchduration); | ||
} | } | ||
+ | } | ||
− | + | function touchend_element_event() { | |
− | + | this.classList.remove('touchDevice-hovered'); | |
− | + | this.classList.remove('touchDevice-longpress') | |
− | + | cancel_timer(); | |
− | + | } | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | function cancel_timer() { | |
− | + | if (timer) { | |
− | + | clearTimeout(timer); | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
timer = null; | timer = null; | ||
− | |||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | + | ||
+ | function onlongtouch() { | ||
+ | timer = null; | ||
+ | this.classList.add('touchDevice-longpress'); | ||
} | } | ||
− | + | var touch_div = document.getElementsByClassName("touch-dev"); | |
+ | for(var i = 0; i < touch_div.length; i++) | ||
+ | { | ||
+ | touch_div[i].addEventListener('touchstart', touchstart_element_event, true); | ||
+ | |||
+ | touch_div[i].addEventListener('touchend', touchend_element_event, true); | ||
+ | touch_div[i].addEventListener('touchmove', cancel_timer, true); | ||
+ | |||
+ | touch_div[i].addEventListener('touchcancel', cancel_timer, true); | ||
+ | } |
Version vom 1. Oktober 2021, 20:15 Uhr
/* Das folgende JavaScript wird für alle Benutzer geladen. */ var lastTouchTime = 0; var isTouched = false; var timer = null;; var touchduration = 500; function mousemove_event() { if (isTouched || (new Date() - lastTouchTime < 500)) return; document.body.classList.add('hasHover'); } function touchstart_event() { isTouched = true; document.body.classList.remove('hasHover'); } function touchend_event() { isTouched = false; lastTouchTime = new Date(); document.body.classList.remove('hasHover'); } document.addEventListener('touchstart', touchstart_event, true); document.addEventListener('touchend', touchend_event, true); document.addEventListener('mousemove', mousemove_event, true); mousemove_event(); function touchstart_element_event() { this.classList.add('touchDevice-hovered'); if (!timer) { timer = setTimeout(onlongtouch.bind(this), touchduration); } } function touchend_element_event() { this.classList.remove('touchDevice-hovered'); this.classList.remove('touchDevice-longpress') cancel_timer(); } function cancel_timer() { if (timer) { clearTimeout(timer); timer = null; } } function onlongtouch() { timer = null; this.classList.add('touchDevice-longpress'); } var touch_div = document.getElementsByClassName("touch-dev"); for(var i = 0; i < touch_div.length; i++) { touch_div[i].addEventListener('touchstart', touchstart_element_event, true); touch_div[i].addEventListener('touchend', touchend_element_event, true); touch_div[i].addEventListener('touchmove', cancel_timer, true); touch_div[i].addEventListener('touchcancel', cancel_timer, true); }