본문 바로가기

컴터/html5

print screen 후 웹페이지에 붙여넣기 하기 * 프린트 스크린후 웹페이지에 붙여넣기 Paste Capture 'Image' 설명 더보기
input type="file" 폴더 업로드 (webkitdirectory directory) http://stackoverflow.com/questions/12942436/how-to-get-folder-directory-from-html-input-type-file-or-any-other-way demo : http://whatdo.net/html5/example/#10 attribute 가 webkitdirectory directory 인듯하니 웹킷 엔진만 된다. 2016.05.17 확인해본바, 윈도우는 최신 크롬계열(카나리포함),오페라,비발디가 지원하며 IE11 이 의외로 지원한다.파폭,사파리,스윙은 지원하지 않는다. Mac은 크롬,카나리,chrome for dart 만 지원한고,파폭(개발자버전포함),사파리,오페라는 지원하지 않는다. 현재 webkitdirectory 만 인식하고 direc.. 더보기
input type="number" 에서 소수점 입력하고 전송시 유효성검사 통과에 막힐때? 참고 : http://blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrome/http://stackoverflow.com/questions/19011861/is-there-a-float-input-type-in-html5 방법1.ddd 방법2.ddd step 을 원하는 자리 소수점을 하던가 any 라고 값을 준다.증가 감소 화살표 누를때 좀 뭐하겠지만 ㅡㅡ; 더보기
js canvas로 만든 간단한 bar 형태 챠트 미완이지만, 회사일로 bar형태의 챠트를 만들어 보았습니다. 현재는 jquery 플러그인을 수정해서 작업하고 있지만, 야무지게 직접 만들어 보겠다고 시작했는데 역시 좌절하고 작업한데까지 공개합니다. 중요한것만 설명할께요. 1. 꼭 3개 js모두 로드해야 합니다. jquery는 모두 아실테고, NDChart.js는 만든거, excanvas.js 는 ie에서 canvas 태그를 사용할수있게 해주는 공개 소스입니다. 2. 데이터 형태는 json 형태로 받습니다. nd.data = [ {label:"가다라마바",value: [ {label:"1월",value:"155"}, {label:"2월",value:"110"}, {label:"3월",value:"50"} ]}, ]; 워낙 단순?해서 나머진 첨부파일의 te.. 더보기
[html5] 안드로이드 브라우저에서 video 태그 사용하기 동영상 모바일 웹페이지 작업을 하고 있었습니다. html5는 video 태그를 사용해 별도의 플러그인 없이 영상을 재생하는데, 아이폰의 safari나 기타 IE를 제외한 많은 브라우저가 이것을 지원합니다. 여러 테스트중 안드로이드 브라우저에서는 video 태그가 되긴 하지만 플레이가 나오지 않더군요. http://html5test.com/ 사이트에서 브라우저 테스트해도 video 태그는 지원하지만, h264나 theora 영상의 플레이는 "X" 표시가 되어 있더군요. 그래서 안되는구나 하고 포기했고, 어차피 넥원일 경우 플래시가 되니 플래시로 플레이 되게 작업 해놓았습니다. 그런데 어제 버스에서 듣기만하는 트위터에서 http://twitter.com/xguru 이분의 한마디에 가능한걸 알아죠. 결론은 넥.. 더보기
iPad(아이패드) 사파리 코딩시 QUOTA_EXCEEDED_ERR 에러 날때. http://stackoverflow.com/questions/2603682/is-anyone-else-receiving-a-quota-exceeded-err-on-their-ipad-when-accessing-locals function setkey(key, val){ sessionStorage.removeItem(key); //먼저해주어야... sessionStorege.setItem(key, val); } //->localStorage 도 같은 오류 뱉음. //iphone 은 이런 증상 없고, pc 사파리도 이런 증상 없음.. 유독..아이패드ㅋ ... 2015.08.06 메모 (http://unikys.tistory.com/341)IOS8 기준으로 개인정보 보호가 된 브라우징탭에선 webStorag.. 더보기
html5 비디오 코덱 지원 여부 스크립트 /* mpeg4 : canPlayType('video/mp4; codecs="mp4v.20.8"') h264 : canPlayType('video/mp4; codecs="avc1.42E01E"') webm : canPlayType('video/webm; codecs="vp8"') ogg : canPlayType('video/ogg; codecs="theora"') 리턴값이 probably, maybe -> 둘 중 하나면 지원한다 */ function supportsH264Ogg() {//h264 나 theora 지원여부 체크 var obj = document.querySelector("#video"); var ogg = obj.canPlayType('video/ogg; codecs="theora"'); .. 더보기
[html5 예제] video 태그위에 자막 비슷하게 샘플 : http://whatdo.net/html5/example/#6 인코딩 툴 : http://nosmoke.cctoday.co.kr/1067 애니를 자주 보는데, 플레이어 어플처럼 자막을 입혀 보았습니다. 자막 파일 .smi 파일을 읽어와서 시간에 맞춰 불러들이는 것입니다. 로컬파일을 읽어 오고 싶었지만, 역시 정책상 막아놓았네요. 서버측에서 html5 코덱으로 인코딩후 smi 파일을 같이 올려놓으면 자막과 같이 플레이 되게하는 그냥 간단한 아이디어 겸 메모였습니다. ^^ javascript (jquery) ::: var p = { vars:[자막파일], logWrite:function(v){ //for(var i in v) $("#log").append(v+" "); }, mPos:function.. 더보기