[IT/Programming]/HTML related 썸네일형 리스트형 HTML 가로 Slide 구현하기 # HTML 가로 Slide 구현하기 다음이나 네이버 메인 페이지의 가로 slide 들이랑, 사진 가로 slide 들을 어떻게 구현할 수 있는지 궁금해서 알아보는 중. 똑똑하게 scroll 동작을 인식해서 가로 slide 를 바꿔주는게 필요한듯. CSS 를 어떻게 해줘야 하는지가 조금 헷갈리고... ## TOC ## 사진 가로 slide ## rolling, flexible, counter content 1 content 2 content 3 content 4 prev next current : 2, total : 4 ## limit, page:2, speed:300 content 1 content 2 content 3 content 4 prev next ## multiple, view:3, limit .. 더보기 HTML event handler # HTML event handler HTML event handler. Javascript/jQuery 로 HTML 에서 일어나는 여러가지 event 들을 처리해서 interactive 한 페이지를 만들 수 있음. 그런데 헷갈리는 것들이 많고, 어떤 event 들이 있는지도 다 기억하기 힘들어서 정리하는 중. ## PH 2016-02-01 : Smart phone touch event 관련 정리. 2015-12-10 : 조금 더 정리. 2014? : First posting. ## TOC ## Mouse and Touch event ### On click event (getting event position) ```[#mouse-event-result.scrollable] mouse-event-resu.. 더보기 Javascript namespace or encapsulation Javascript namespace or encapsulation C, C#, C++, JAVA 등 에서의 "namespace, private variable, private method" 같은 효과들을 javascript에서 어떻게 비슷하게나마 구현할 수 있는지에 관한 이야기. (자세한 정리는 에서 보시길. 제대로 정리하기가 귀찮아서 -ㅇ-;;; 하더라도 천천히 나중에나 할듯.) (예전에 공부하면서 그냥 대충만 정리해 놓은것들이라;;; 여기선 정말 대충, 엉터리로 정리해놨으니 reference들 참고해서 공부하세요.) Closure란 특성을 이용하는 것인데... Garbage collection과도 관련이 있고... Closure란 단어가 너무 추상적인듯도... closure 특성이라고 많이들 이야기.. 더보기 반응형 웹 만들기 (Responsible/Scalable web design with css media query) # 반응형 웹 만들기 (Responsible/Scalable web design with css media query) 기본적으로 어느 인터넷 브라우저에서든 Ctrl+mouse wheel 을 하면 scale 을 바꿀 수 있음. Chrome 은 site 별로 이 scale 도 저장해놔서 나중에 왔을때도 같은 scale 로 web-page 를 볼 수 있음. 개인적으로 국내 web page 들 90% 이상에서 글씨 크기가 눈나쁜 나한테는 너무 작아서... 항상 scale up 해서 보는 경향이... Chrome 기본 설정에서도 기본 글씨 크기를 바꿀 수 있긴 한듯. 그런데 어차피 사이트 제작자가 그냥 font 에서 layout 을 맞춰놓은 경우가 많아서.. 이걸 바꾸면 overflow 나고 이럴 경우도 많을듯.. 더보기 티스토리 단축키 설정 (+단축키 추가/수정하기) 티스토리 단축키 설정 (+단축키 추가/수정하기) 티스토리에 단축키가 있다는걸 최근에야 깨달음;;; 티스토리 단축키 설명은 sidebar에도 표시해 놨음. Posting History 2014-06-20: First Posting. Table of Contents 티스토리 기본 단축키 티스토리 기본 단축키 Q: 관리자 (Admin) A: 이전 글 S: 다음 글 Z: 최근에 올라온 글 X: 최근에 달린 댓글 C: 최근에 받은 트랙백 개인적으로 추가한 단축키 D: Previous Section F: Forward Section L: To the [Lists] 글쓰기에 들어가면 에디터에도 단축키들이 많은것 같지만, 난 HTML로 쓰는 경우가 많아서 이것 관련 정리는 패스. 단축키 추가/수정하기 단축키를 추가하거.. 더보기 Customized styling of scroll bars in HTML Customized styling of scroll bars in HTML First posting at 2014-05-26 Cross browsing 문제가 심하긴 한듯. Table of Contents in Webkit browser (Chrome, Safari, Opera) 설정들은 참조해서... ▲ default scrollbars. ::-webkit-scrollbar{ /* 1 */ } ::-webkit-scrollbar-button{ /* 2 */ } ::-webkit-scrollbar-track{ /* 3 */ } ::-webkit-scrollbar-track-piece{ /* 4 */ } ::-webkit-scrollbar-thumb{ /* 5 */ } ::-webkit-scrollbar-.. 더보기 Improving web performance Improving web performance 그냥 구글에 "improving web performance" 검색하면 여러가지 잘 정리해놓은 페이지들이 나오는듯. References and Related Articles Six Revisions - 10 Ways to Improve Your Web Page Performance, 2008-12-22, by Jacob Gube.; 꽤나 잘 정리되어 있는듯. pamela fox's blog - Improving front page performance: removing images, 5 ways, 2014-01-30.; TinyPNG로 이미지 용량줄이기, Delay load로 scroll 되기 전의 load 줄이기. tutsplus - Best Practic.. 더보기 Citing the references automatically in HTML (like LaTeX) Citing the references automatically in HTML (like LaTeX) I cite the first ref . And citing the second , I cite finally the third one . There could be more than one cite in the article . You can check those references. web:, ref2:. kipids:, no:, unknown:. Bubble reference which is cited manually: [01] Ref. [01] This is a manual reference. So this is not listed below in Reference section. On mouse.. 더보기 이전 1 ··· 6 7 8 9 10 11 다음
