World Wide Web 썸네일형 리스트형 모바일에서 a태그 영역 감추기 12-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color: transparent; /* For some Androids */cs 출처: http://august5pm.tistory.com/26 [어느 팔월의 오후 다섯시] 더보기 IE, FF, CR에서 볼수 있는 동영상 인코딩설정 각 브라우져마다 비디오태그에 지원하는 동영상 확장자가 다르다MP4 파일 : IE, CR, FF, SafariWebM 파일 : CR, FF, Operaogg 파일 : CR, FF, Opera 편리하게 MP4하나로 IE, CR, FF, Safari에서 모두 재생 가능한 인코딩 설정법이 있다. 더보기 HTML5 video fullscreen HTML5의 비디오태그로 전체화면을 하는 javascript방법과 css방법이다. 1. JAVASCRIPT12345678var elem = document.getElementById("myvideo");if (elem.requestFullscreen) { elem.requestFullscreen(); } else if (elem.mozRequestFullScreen) { elem.mozRequestFullScreen(); } else if (elem.webkitRequestFullscreen) { elem.webkitRequestFullscreen(); }Colored by Color Scriptercs 2. CSS1234567video { position: fixed; right: 0; bottom: .. 더보기 브라우져 체크 123456789101112131415161718192021222324252627282930313233343536// 브라우저 및 버전을 구하기 위한 변수들.//'use strict';var agent = navigator.userAgent.toLowerCase(), name = navigator.appName, browser; // MS 계열 브라우저를 구분하기 위함.if(name === 'Microsoft Internet Explorer' || agent.indexOf('trident') > -1 || agent.indexOf('edge/') > -1) { browser = 'ie'; if(name === 'Microsoft Internet Explorer') { // IE old version (I.. 더보기 html5 video tag 정지, 재생, 처음부터 재생 시키기 12345 Colored by Color Scriptercs video 태그를 이용하여 stop, play하는 방법을 배워보자.평소에는 쓰임새가 없어서 써보지 않았던 video태그를 제안에 쓸일이 구글링을 통하여 재생, 정지, 리플레이를 찾아보았지만 작동이 되질 않는다.123$("#video1").stop();$("#video1").play();$("#video1").currentTime();cs 구글링을 통해서 찾은 video 태그의 콘트롤 방법이였다. 해결책은 어떤 책에서 발견했는데 무슨 책인지 기억이 나질 않는다. 어찌되었든 코드는 123$("#video1").get(0).stop();$("#video1").get(0).play();$("#video1").get(0).currentTime();cs .. 더보기 레이어팝업 띄우고 포커스 레이어팝업으로 이동시키기 웹접근성 인증마크를 획득하지 않더라도 기본적으로 표준을 준비하는것이 좋다.신규구축에는 인증마크 획득 이슈가 없더라도 구축이 완료된 후에 따로 재의뢰가 들어오는 경우도 있기때문이다. 이런 경우를 가끔 겪다보니 이제는 표준을 준수하면서 코딩을 해나가고 있다. 요즘은 디자이너 또는 고객사의 요청으로 윈도우팝업보다는 레이어팝업이 더욱 많이 이용되고 있는것이 현실이고 이에 대응하기 위해서 레이어팝업을 띄우면 탭으로 포커스 이동시 바로 팝업으로 향해야된다. 오늘은 그 방법을 알아보도록 하자.12345678910111213141516171819202122var $this; $(".btn").click(function(){ $(".layerPop1").attr("tabindex", 0).show().focus(); $.. 더보기 정찬명님의 반응형 웹 구축기 정찬명님이 2012년도에 발표하신 반응형 웹 구축기입니다.modernizr 찾아보다가 우연히 읽었는데 매우 좋은 내용이라 공유드립니다.이미 읽어보신분들도 계시고 처음 보시는분들도 계시겠지만 오래된 자료이긴하나 분명 좋은 자료임에는 틀림없습니다. http://naradesign.net/rwd/pr/?#s1 더보기 css3 flip효과주기 IE9 이하에서는 동작이 안됩니다. 때문에 사용자를 위한 대책마련이 필요합니다. HTML12 CSS.container { width: 200px; height: 260px; position: relative; perspective: 1000px;}#card { width: 100%; height: 100%; position: absolute; transform-style: preserve-3d; transition: transform 1s;}#card div { margin: 0; display: block; position: absolute; width: 100%; height: 100%; backface-visibility: hidden;}#card .front { background: red;}#c.. 더보기 디바이스 세로/가로 모드 체크 모바일에서 세로모드(평소 보는 방향)과 세로모드(동영상등)을 체크해주는 자바스크립트 소스입니다. 주석부분을 참고하시고 유용하게 쓰시길 바랍니다! 1234567$(window).on("orientationchange", function(event){ if(window.matchMedia("(orientation: portrait)").matches){ // 세로 모드 }else if(window.matchMedia("(orientation: landscape)").matches){ // 가로 모드 }});Colored by Color Scriptercs 더보기 [모바일]레이어 팝업 띄운 후 바디 스크롤 막기 레이어팝업을 띄우면 가끔 뒤에 스크롤은 안되게끔 막아달라는 고객님들이 계신다. 고객님은 갑님이시니까 무리가 가지 않는 선에선 원하는대로 다 해드린다. 하지만 잘 모르시는 분들을 위해 아래 소스를 남깁니다! 12바디 스크롤 막기 : $("body").bind('touchmove', function(e){e.preventDefault()});바디 스크롤 해제 : $("body").unbind('touchmove');Colored by Color Scriptercs 더보기 이전 1 2 3 4 ··· 6 다음
IE, FF, CR에서 볼수 있는 동영상 인코딩설정
각 브라우져마다 비디오태그에 지원하는 동영상 확장자가 다르다MP4 파일 : IE, CR, FF, SafariWebM 파일 : CR, FF, Operaogg 파일 : CR, FF, Opera 편리하게 MP4하나로 IE, CR, FF, Safari에서 모두 재생 가능한 인코딩 설정법이 있다.
더보기
