Free & Public HLS Example Test Streams 테스트용 HLS .m3u8 스트림 HTTP Live Streaming 은 Apple에서 구현한 HTTP 기반 프로토콜이다. MPEG-DASH와 같은 공개 표준이 아니므로 일반 커뮤니티에서 생성할 수 있는 많은 컨텐츠와 리소스가 없다. 그러나 아래의 Bitmovin 에서 스트림목록은 자막 + 다중 언어 옵션기능이 포함된 인코딩으로 테스트 스트림 URL 을 제공한다. https://bitdash-a.akamaihd.net/content/MI201109210084_1/m3u8s/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.m3u8https://bitdash-a.akamaihd.net/content/sintel/hls/p..
어떤 엘리먼트를 사용해서 웹을 만들어야 하나
어떤 엘리먼트를 사용해서 웹을 만들어야 하나 HTML5가 2014년 10월 28일 표준안이 확정되고 나서 HTML4 와도 많은 차이점을 보였는데 시멘틱웹을 만들기위해서 개념적으로 분리된 좋은(유용한) 엘리먼트들이 많고 그 개수는 150여개에 다달하지만, 문득 궁금해진게 실제 웹페이지에서 HTML 엘리먼트 태그는 어떠한 것들이 제일 많이 사용되고있을까?.. 평균 25개 구글에서 리서치한 결과 실제로 웹페이지에서는 평균 25개의 태그로 구성된 페이지가 많았다. 자주 사용하는 태그개수가 실제로는 많지 않다라는 뜻인데 아래의 표를 보면, 개인적으로는 이 의외이긴 하지만 결과자료에 본인도 이견이 없다. 조금더 구체적인 자료(설명)은 아래를 참조하도록 하고 https://www.advancedwebranking.c..
박스모델의 생성 : HTML에서 js까지
박스모델의 생성 step01. - 직접그려보기 완성될 박스모델을 머릿속으로만 생각하지 말고 종이에 그려본다. 내가 만들 박스는 아래와 같은 형태이다. 서버와 텍스트는 Table로, 종류와 상태는 같은 div를 사용하는 img 태그를 사용할 예정이다. - 코드 생각해 보기 대략 아래와 같은 구분 영역을 가지게 될 것이다. ~ 이렇게 container_box라는 wrap으로 만들어야 나중에 드래그나 클릭과 같은 기능이 추가되었을 때 가장 이상적으로 제어가 가능하다. container_box는 position을 absolute로 지정해 주면되고, table은 그냥 일반적인 테이블 코딩 종류와 상태의 경우 같은 div에 들어있다. - 코드짜보기 애플PC - 결과보기 아직 우리는 장비와 상태 부분에 css를 적용..
SVG, HTML5, jQuery UI 데모페이지
php CGI의 데이터를 파싱하여 보여줄 수 있는 방법중 가능성들을 보여주기 위하여 데모페이지를 만들었다..알파버전.. 브라우저에서 구현 가능한 (무거운 라이브러리는 쓸수없으므로 제외) SVG와 HTML5의 Canvas를 가지고 DOM으로 애니메이션및 드래그, 선그리기를 표현했다. 이걸가지고 솔루션에 어떻게 도입하고 어떤걸 보강하고 플랫폼을 가려내고 등등 할것인지 논의할 량으로 만든 데모... 사족을 달자면 SVG와 관련된 기술이나 자료가 국내에는 정말정말 드물다 구글링+영어번역으로 5시간동안 헤메이기도... 만들면서 느낀거지만 역시 향상된 뛰어난 기술들은 아직도 많다. 소스코드를 보면 어렵지 않게 코딩해보았지만 데모 페이지다 보니 중복되는 코드나 짜깁기(좀 지저분)하다. 크롬에서 볼것 : serpiko..
테이블샘플
테이블샘플 HTML 테이블 직접 코딩해서 만든 샘플. CSS를 보면 DIVision안에 코드는 명시적으로 직접 선언되었기 때문에, 미세하겠지만 빠른 퍼포먼스를 가진다. css의 순서선택자 (first-child, last-child, nth-child(n)..) 을 사용하여 odd와 even 처리를 했다. 소스코드) 공연정보 공연/행사명 2014년 새해맞이 국악한마당 “serpiko와 판소리” 기간 기간데이터 시간 시간데이터 장소 장소데이터 가격 관람료 할인정보 할인정보 관람연령 관람연령데이터 제작 제작데이터 문의 문의데이터 공지사항 공지사항 결과) 실제 iframe으로 삽입한 결과 실무) sql > php > javascript > html 로 데이터수신 표기
기본엘리먼트 작성하기 - nonCss
HTML5's header, nav, article, aside, footer header는 블로그의 제목같은 정보를 그룹핑 다른 페이지로 이동할 수 있는 메뉴와 같은 요소. javascript actionscript php mySQL linux c/c++ 페이지의 핵심적인 내용. 본문 오늘은 회사에서 일을 집에서 운동을 내일은 회사에서 칼퇴를 집에서 휴식을 페이지의 핵심적인 관련이 없는 부가요소 최신글 카테고리 페이지 하단의 요소들 회사정보 회사정책 회사주소 결과)
Content Previous Next IndexTables 1연락처 : sw390126@hotmail.com여기에서는 HTML 문서에서 Table(표)을 만드는 것에 대하여 3번에 걸쳐 알아 보기로 한다. Table을 만드는데 있어 기본 Tag 은 아래 List 와 같다. Table 을 만들기 위해서는 Table 이라고 정의하는 Table Tag 과 가로줄을 정의하는 TR Tag 및 세로줄을 정의하는 TD 또는 TH Tag 이 합쳐야만 하나의 표를 만들 수 있다.TableTRTDTHCaptionTableTable Tag 은 Table(표)을 정의한다. Table 은 Table Tag 안에 가로줄(행-Row)을 만들어 주는 Tag 과 Cell(Column-세로줄 이라고 하면 이해가 빠를 것 같다)을 만들..
SymbolCodeEntity Name™™ € €Space !! """## $$ %% &&&'' (( )) ** ++ ,, -- .. // 00 11 22 33 44 55 66 77 88 99 :: ;; >>?? @@ AA BB CC DD EE FF GG HH II JJ KK LL MM NN OO PP QQ RR SS TT UU VV WW XX YY ZZ [[ \\ ]] ^^ __ `` aa bb cc dd ee ff gg hh ii jj kk ll mm nn oo pp qq rr ss tt uu vv ww xx yy zz {{ || }} ~~ Non-breaking space ¡¡¡¢¢¢£££¤¤¤¥¥¥¦¦¦§§§¨¨¨©©©ªªª«« ¬¬¬®®®¯¯¯°°°±±±²²²³³³´´´µµµ¶¶¶··..
제이쿼리로 셀렉팅하여 canvas의 속성인 width, height을 attr메서드를 사용하여 제어하고, css메서드로 속성을 추가,제어 한다. 자바스크립트의 DOM으로 context를 선언한다. 만약 한가지만으로 처리하려면 에러가 난다. (원인불명) 오류1. var canvas = $('#canvasID'); canvas .attr({'width':826, 'height':624}).css({'border':'red solid 2px'}).css('left', gap); context = canvas .getContext('2d'); 제이쿼리에 미리 HTML5 명세가 정의되어 있지않다면 위의 오류는 이해가 간다. canvas .getContext('2d')는 곧 $('#canvasID').getCont..