hybrid app 썸네일형 리스트형 [css3] image crop center div { width: 200px; height: 200px; overflow: hidden; position: relative; } img { position:absolute; left: -100%; right: -100%; top: -100%; bottom: -100%; margin: auto; min-height: 100%; min-width: 100%; }http://stackoverflow.com/questions/18673900/how-to-center-and-crop-an-image-to-square-with-csshttp://stackoverflow.com/questions/11552380/how-to-automatically-crop-and-center-an-image 더보기 [css3] div 안에서 줄바꿈 white-space: pre; 더보기 [css3] ios overflow scroll 부드럽게 하기 ios에서 css속성에 overflow: scroll를 주면 스크롤시 부드럽지 못하고 뚝뚝 끊기는 현상이 있다.이를 자연스럽게 하기 위해서 아래 속성을 추가하면 된다. -webkit-overflow-scrolling: touch; 더보기 [css3] 크기 연산하기 calc함수를 사용하면 css상에서 연산이 가능하다. javascript단에서 연산해서 적용하는 수고를 덜어준다. 사용법은 간단하다. width: calc(100%/3); 이런식으로 나누기 연산이 가능하며 width: calc(100%/3 - 20px); 이렇게 하면 3을 나눈후 20px를 빼준다. 더보기 [html5] Firefox mac에서 video mp4 재생 문제 테스트를 하던중 Mac의 FireFox에서는 mp4가 재생되지 않는 문제가 발생함 FileFox홈페이지에 들어가 보니 아래와 같이 아직 Mac에서는 mp4가 지원되지 않고 있었습니다. https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats 아래 페이지를 Mac과 Window의 FireFox로 들어가 보면 직접 눈으로 확인해 볼 수 있습니다. http://www.quirksmode.org/html5/tests/video.html 더보기 [html5] Cross Document Messaging (postMessage, onmessage) iframe으로 데이터를 전달하고 받는 방법을 찾다가 알게 되었다. 크로스 도큐먼트 메시징(Cross Document Messaging)을 사용하면 두개의 웹 페이지가 서로 메시지를 주고 받을 수 있다. Cross Document Messaging의 장점은 서로 다른 도메인에 존재하는 페이지끼리도 메시징이 가능하다. Same Origin Policy에 적용받지 않아 도메인을 넘나드는 연동 구조에 적합하다. 데이터 전송하기window.postMessage(data, [ports], targetOrigin) data : 전달할 메시지ports : 메시지 포트(생략 가능)targetOrigin : 메시지를 수신받는 도메인을 지정한다. 대상이 특정 도메인이 아니라면 *로 지정 데이터 수신하기데이터 수신하는 측에.. 더보기 모바일에서 숫자 자동전화걸기 자동 링크 방지 ios상에서 숫자가 연속적으로 나올때 번호를 전화번호로 인식하여 링크시켜준다. 이를 방지하기 위해서 다음의 메타테그를 추가하면 된다. 더보기 [css3] 미디어쿼리 세로모드 가로모드 구분 @media all and (orientation:portrait) {...} //세로모드, 뷰포트 높이가 너비에 비해 상대적으로 크면 실행 @media all and (orientation:landscape) {...} //가로모드, 뷰퍼트 너비가 높이에 비해 상대적으로 크면 실행 더보기 [hybrid app] 캠프앱 개발 사례를 통해 본 하이브리드앱 어디까지 캠프앱 개발 사례를 통해 본 하이브리드앱 어디까지 | Devon 2012 from Daum DNA 더보기 [css3] CSS3를 마스터하는 것을 도와줄 튜토리얼 30선 http://dizyne.net/30-tutorials-help-master-css3/ 더보기 이전 1 2 3 4 ··· 6 다음