타일로그

javascript eslint 사용기 < 꼴도보기 싫었던 eslint를 적용시키다 > 미루고 미뤄왔던 eslint를 드디어 적용하기 시작했다. 대략 6달 전에 하려고 시도 했을 때 파일 하나만 테스트 해 보았더니 js파일하나에 에러가 수천개 나는것 보고 어처구니가 없어서 바로 지웠었는데, 최근 같이 스터디 어떤분... read more 정백경 2017-03-09 18:29:46 [jQuery] 컨텐츠 페이지에서 스크롤상태 표시하기- Progress Indicator < 스크롤 되면 현재 위치를 계속 보여준다. > 본문의 내용이 긴 경우에 사용자에게 현재 어느정도 읽었는지 알려주면, 사용자에게 보다 많은 정보를 내어주게 되는 것이며 이는 곳 사용자 스스로 통제권을 더 가지고 있다고 느껴지게 만듭니다. 긴 글은 사용자가 의도적으로 집중하면서 ... read more 이흥현 2016-12-01 11:58:21 [jQuery] 카드뉴스 플레이어 Github : https://github.com/tyleteam/jquery-tyle-player < 카드뉴스 플레이어 동작 모습 > 타일이 주력하는 부분은 디자인 자동화이고 그렇게 생산된 이미지 컨텐츠들이 어디에서 어떻게 소비되는지는 크게 관여하지는 않는다. 이미 기존에 트... read more 이흥현 2016-11-29 19:08:53 모바일 사용성 증대를 위한 모달창 히스토리 관리 전통적으로 모달이라함은 DOM 요소를 새로운 창처럼 꾸며서 화면상에 보여주는 것입니다. 그냥 꾸며진 DOM에 불과해서 미니 팝업처럼 보이지만 사실은 그냥 DOM 요소일 뿐이지요. 예전부터 웹 기반에서도 브라우저 히스토리의 뒤로가기/앞으로 가기와 따로 놀기 때문에 사용성에 대해서... read more 이흥현 2016-11-28 16:48:33 pjax를 이용한 극적인 웹페이지 속도 향상 < 출처:픽사베이 > 웹사이트에서 사용자의 반응(링크클릭)등에 빠른 속도로 반응하는 것은 항상 웹개발자들의 꿈이다. 느려터진 웹사이트는 사용자를 짜증나게하고 이탈률을 증가시킨다. 가장 속도를 빠르게하는 것은 원격서버를 통하지 않고 로컬에서 다 해결하면 된다! 하지만 이것은 불가... read more 이흥현 2016-11-28 12:16:31 빙글빙글 로더(스피너)를 만들어보자 스피너는 UI의 요소인데, 사용자가 어떤 액션을 취하고나서 결과가 화면상에 반영되기까지, 원격으로의 요청이나 컴퓨터가 무언가를 처리하고 있다고 알려주는 기능을 한다. 그냥 쉽게 말해서 로딩걸려있을 때 사용자 행동을 막고 뺑글뺑글 도는 그런거다. 이게 과연 사용자 경험에 도움이 ... read more 이흥현 2016-11-26 00:06:18 모바일에서 확대 축소가 가능한 이미지 모달창 반응형으로 컨텐츠 페이지를 작성하는 경우에 본문내의 이미지를 어떻게 확대하여 보여줄 것인가에 대한 고민을 하게 된다. 아직까지 자바스크립트 플러그인으로 제공되는 LightBox류들은 멋진 트랜지션과 함께 확대는 해주긴 하지만, 모바일에서 확대했을 때에는 본문용 크기나 모달에서 ... read more 이흥현 2016-11-23 23:46:42 모바일상에서 가상 키보드 여부 인식 모바일 기기상에서 input에 focus가 발생하면서, 가상키보드가 나타나게 되면, window의 크기 변화도 수반한다. 그렇다면 window width와 height의 비율을 통해서 가상키보드 등장 여부를 알아낼 수 있게 된다. 이 코드는 작동되는 코드를 기초로 간략화한 버전... read more 이흥현 2016-03-15 16:14:34 링크를 통한 페이지 닫힘에도 확인창 띄우기 게시물이나 코멘트를 작성하려는 경우 전송을하지 않고 나가게 되면 ‘정말로 이 페이지를 벗어나시겠습니까?’ 라고 물어보는 자바스크립트다. 원리는 굉장히 간단하다. 위 처럼만 간단하게 작업을 해두면, 브라우저상의 새로고침이나 창(탭)닫기에만 반응할 뿐, 내부 링크를 통해서 벗어나는... read more 이흥현 2016-03-15 16:14:34