메뉴 건너뛰기

조회 수 7062 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
<!doctype html>
< html lang="en">
< head>
    <meta charset="utf-8"/>
    <title> Dougy's HTML5 </title>
< /head>
< body style="background-color:#8EE5EE;">
    <div id="big_wrapper">
        <video src="song.mp4"> </video>
    </div>
< /body>
< /html>

제 동영상 파일은 이름이 song.mp4 입니다.

크롬 브라우저에서 실행하면 위와 같이 나옵니다.
동영상이 play되지도 않고 어디 play버튼이나 stop 버튼 뭐 이런게 하나도 없습니다.
video 태그를 아래와 같이 고쳐 보세요.
< video src="song.mp4" controls > </video>


그냥 video 태그에 controls만 넣었는데 플레이버튼, 정지버튼,진행상황 bar 그리고 볼륨조절까지 다 나오네요.

video tag 안에 width와 height도 넣을 수 있습니다. 그러면 동영상 사이즈가 변할 겁니다.
이 video tag 안에 넣을 수 있는 속성들은 아래와 같은 것들이 있습니다.
다 보시면 아실 겁니다.
아래와 같이 video 태그를 바꿔보세요.
< video src="song.mp4" controls width="640" height="360" loop poster="video05.png"> </video>
너비, 높이를 지정했고 루프를 선언했고 poster에 한 이미지를 지정했습니다.
(저는 HTML5 로고를 사용했습니다.)
그러면 처음 실행될 때 poster에서 지정된 이미지가 나타나고 재생 버튼을 누르면 동영상이 시작됩니다.
여기에 autoplay를 추가하면 자동으로 동영상이 시작되겠죠?
여러분들이 필요한 속성을 사용하시면 됩니다.

  1. ImageVeiw의 현재 리소스 비교하기

    Date2014.08.28 Views6752
    Read More
  2. Effects - SlideToggle() 메서드 (슬라이드 업/다운)

    Date2014.10.16 Views6762
    Read More
  3. CSS3 Rounded Corner, 그림자 효과 사용하기

    Date2014.09.04 Views6765
    Read More
  4. [안드로이드] Activity에 대해서

    Date2015.07.16 Views6767
    Read More
  5. 특정 폴더에서 오래된 파일 삭제하기

    Date2015.07.16 Views6771
    Read More
  6. [안드로이드] 빠르게 사용할수 있는 컨텍스트 메뉴 만들기

    Date2015.09.03 Views6800
    Read More
  7. HTML5 Geolocation (구글 지도에 현위치 표시하기)

    Date2014.09.04 Views6810
    Read More
  8. [안드로이드 강좌] 초보자들이 많이 하는 실수

    Date2015.08.11 Views6833
    Read More
  9. android SMS 리시버

    Date2015.06.29 Views6871
    Read More
  10. Android] 안드로이드 홈 디렉토리 알아내기

    Date2015.12.15 Views6895
    Read More
  11. 내가 입력한 글자 Toast로 나오게 하기

    Date2015.07.26 Views6900
    Read More
  12. 옵션 메뉴 동적으로 생성하기

    Date2015.07.16 Views6928
    Read More
  13. [안드로이드] 레이아웃의 기본1

    Date2015.07.16 Views6965
    Read More
  14. 푸시 서비스(GCM)에 대해 알아보자

    Date2015.07.01 Views7004
    Read More
  15. [안드로이드] 버튼 이벤트 처리하기

    Date2015.07.17 Views7030
    Read More
  16. 안드로이드 android 개발 와이파이 유지 관련

    Date2015.07.16 Views7034
    Read More
  17. 안드로이드 웹에서 이미지 불러오기!!

    Date2014.08.28 Views7055
    Read More
  18. HTML5로 비디오 보여주기 Video Tag

    Date2014.09.04 Views7062
    Read More
  19. 인텐트를 이용한 Activity간 데이터 전달 (사용자 정의 클래스)

    Date2015.07.16 Views7062
    Read More
  20. [Android 2.3] SharePreference

    Date2015.07.01 Views7065
    Read More
Board Pagination Prev 1 ... 3 4 5 6 7 8 9 10 11 12 13 Next
/ 13

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved