반응형 웹 개발 중에서 브라우저를 아래로 당겼을 때 새로고침 되는 현상을 없애주는 코드
/*
prevent pull-down-to-refresh of mobile chrome
https://stackoverflow.com/a/55832568
*/
(function() {
var touchStartHandler,
touchMoveHandler,
touchPoint;
// Only needed for touch events on chrome.
if ((window.chrome || navigator.userAgent.match("CriOS"))
&& "ontouchstart" in document.documentElement) {
touchStartHandler = function() {
// Only need to handle single-touch cases
touchPoint = event.touches.length === 1 ? event.touches[0].clientY : null;
};
touchMoveHandler = function(event) {
var newTouchPoint;
// Only need to handle single-touch cases
if (event.touches.length !== 1) {
touchPoint = null;
return;
}
// We only need to defaultPrevent when scrolling up
newTouchPoint = event.touches[0].clientY;
if (newTouchPoint > touchPoint) {
event.preventDefault();
}
touchPoint = newTouchPoint;
};
document.addEventListener("touchstart", touchStartHandler, {
passive: false
});
document.addEventListener("touchmove", touchMoveHandler, {
passive: false
});
}
})();
LIST
'Study > 개발 Tip' 카테고리의 다른 글
Javascript 리소스 모음... 공부해야 될 것들 / 21.12.31 (0) | 2021.12.31 |
---|---|
반응형 웹 모바일 브라우저 주소창을 고려한 css height 설정 (0) | 2021.12.19 |
개발자가 알아야할 Git Repository 목록 (0) | 2021.12.18 |
개발자를 위한 킬러 웹사이트 10개 공개 (0) | 2021.12.18 |
개발에 필요한 오픈소스 모음 (0) | 2021.12.11 |