본문 바로가기

Event2

[javascript] 모바일 검색창 숨기기 기능 구현 (터치 떨림 보정) 모바일에서 작동하는 검색창을 구현하려던 도중 터치아웃을 하는 순간 스크롤 감지에 의해 검색바가 깜빡이는 현상에 부딧혔다. 해당 버그를 수정하기 위해서 별의 별 짓을 다햇다.. lodash의 throttle 이나 touchout, touchstart 등등 여러가지 이벤트로 핸들링 하려고 해봤지만 깜빡이는 문제를 잡기 쉽지않았다.(스크롤이 워낙 민감하게 동작하기때문에..) 그러던 도중, 해당 글을 발견했고 jQuery 대신 javascript 로 구현한 로직을 짤 수 있었다. 사실, setInterval을 쓸 생각은 하지도 못했는데 덕분에 좋은 기능 구현을 할 수 있었다. :-) javascript var didScroll; var lastScrollTop = 0; var delta = 5; var navb.. 2023. 1. 30.
[javascript] 스크롤 내릴때 사라지고 올라갈때 나오는 검색바 만들기 (앱 호환) window.addEventListener를 사용하면 매우 많은 이벤트 함수를 실행할 수 있다. 보통은 scroll, mouseWheel 이벤트를 사용해 휠스크린을 내릴시 간단하게 화면을 조작할 수 있다. 👉 mouse wheel 이벤트 보기 Element: wheel event - Web APIs | MDN The wheel event fires when the user rotates a wheel button on a pointing device (typically a mouse). developer.mozilla.org mouse wheel 이벤트를 사용할 경우의 문제점이 휠을 사용하지 않는 앱웹에선 작동하지 않는다는점이다. 이런경우 scroll 이벤트를 사용해 처리하는것이 좋다 👉 scroll 이.. 2022. 11. 23.
반응형