Homzzang
구글
다음
네이버
코딩동강
[JS-바위] JS 23강 - 비디오 (Video), 오디오 (Audio) - 미디어 컨트롤
652
https://youtu.be/s28fmRV9gz8
(163)
이전글
다음글
목록
글쓰기
준비 중
주소 복사
랜덤 이동
코딩동강 관련글
JS 23강 - 비디오 (Video), 오디오 (Audio) - 미디어 컨트롤
HTML 관련글
HTML - sizes 속성 - 해상도별 이미지나 아이콘, 미디어(오디오/비디오) 등의 크기 지정 (= sizes속성 = 사이즈스속성)
HTML - preload 속성 - 페이지 로드 시, (오디오/비디오) 미디어파일을 로드할지 여부와 방법을 지정 (= preload속성 = 프리로드속성)
HTML - poster 속성 - 비디오태그용 포스터 지정 (= poster속성 = 포스터속성)
HTML - onwaiting 속성 - (오디오/비디오) 다음 프레임 버퍼 위해 재생 멈출 때 실행 (= onwaiting속성 = 온웨이팅속성) ※ onwaiting이벤트 = 온웨이팅이벤트)
HTML - onvolumechange 속성 - (오디오/비디오) 볼륨변경 시 실행 (= onvolumechange속성 = 온볼륨체인지속성) ※ onvolumechange이벤트 = 온볼륨체인지이벤트
HTML - ontimeupdate 속성 - (오디오/비디오) 재생위치 변경 시 실행 (= ontimeupdate속성 = 온타임업데이트속성) ※ ontimeupdate이벤트 = 온타임업데이트이벤트 ※ 현재 재생시간 실시간 표시
HTML - onsuspend 속성 - (오디오/비디오)를 브라우저가 일시중지 시킬 때 실행 (= onsuspend속성 = 온서스펜드속성) ※ onsuspend이벤트 = 온서스펜드이벤트
HTML - onstalled 속성 - (오디오/비디오) 이용불가 (=사용불가) 시 실행 (= onstalled속성 = 온스톨드속성) ※ onstalled이벤트 = 온스톨드이벤트
HTML - onseeking 속성 - (오디오/비디오) 재생위치 변경 시작 시, 실행할 코드 지정. (= onseeking속성 = 온시킹속성) ※ onseeking이벤트 = 오시킹이벤트
HTML - onseeked 속성 - (오디오/비디오) 재생위치 변경 종료 시, 실행할 코드 지정. (= onseeked속성 = 온시크트속성) ※ onseeked이벤트 = 오시크트이벤트
CSS 관련글
CSS - object-position 속성 - <img>/<video>가 "자체 콘텐츠 상자" 내부의 x/y 좌표와 함께 배치되어야 하는 방법 지정 위해 object-fit 속성과 함께 사용 (= object-position속성 = 어브젝트포지션속성)
CSS - object-fit 속성 - 컨테이너에 맞게 '이미지/비디오' 크기 조정 방법 지정 (= object-fit속성 = 어브젝트핏속성) ※ img/video 사이즈 조정
CSS - RES Video - (반응형 동영상)
JavaScript 관련글
JS - 마우스오버 시, 오디오재생 (= mp3재생 = 소리재생)
JS - <video> 객체 ★ - 영상재생 (= video태그 = 비디오태그) ※ 영상파일형식별로 브라우저 지원 상이
JS - <audio> 객체 ★ - 음성파일재생 (=오디오태그 = audio태그) ※ 음성파일형식별로 브라우저지원 상이 ※ 클릭 오디오파일 재생/멈춤 (Click Audio Play/Stop)
JS - objectFit 속성 - 컨테이너에 맞게 <img>/<video> 크기 조정 방법 지정 (= objectFit속성 = 어브젝트핏속성)
JS - timeupdate 이벤트 - 오디오/비디오 재생 위치 변경 발생 (= timeupdate이벤트 = 타임업데이트이벤트)
JS - canplay 이벤트 (= oncanplay 속성) - 동영상재생가능 (= 비디오재생가능/오디오재생가능)
JQuery 관련글
JQ - 스크롤 시 비디오 동영상 자동재생 시작 (Scroll Video Autoplay)
PHP 관련글
SQL 관련글
Bootstrap 3 관련글
Bootstrap 4 관련글
코멘트입력
비밀글
//phpphp if (!is_g5() && (!$is_comment_editor || $mw_basic['cf_editor'] != "cheditor")) { ?>
입력
특수문자
이전글
다음글
목록
글쓰기
전체
BS-나동빈
C-나동빈
C-두들낙서
GO-터커
HTML-바위
JAVA-생코
JQ-샵투
JS-바위
JS-생코
JS-서기
JS-엘리
Node.js-생코
PHP-생코
PHP-서기
PHP-쩡원
PHP2020-서기
PHP7-바위
PHP7-서기
Py_Ru-생코
React
SQL-생코
WEB1-생코
WEB2-생코
am-행복한이웃
regex
서버
코딩 야학
코딩 입문
분류
제목
JS-바위
JS 80~82강 - 자바스크립트 객체 클래스
JS-바위
JS 77~79강 - 자바스크립트 모듈 활용 (Javascript Module)
JS-바위
JS 73~76강 - 테이블 페이지네이션 (Table Pagination)
JS-바위
JS 72강 - AOS 라이브러리 - 슝슝 나타나는 스크롤 애니메이션
JS-바위
JS 69~71강 - 숫자 그래프 애니메이션 (Number Animation)
JS-바위
JS 68강 - animate.css 라이브러리 - 스크롤이벤트 적용
JS-바위
JS 64~67강 - tailwindcss (node js - CSS framework) - CSS 없이 스…
JS-바위
JS 61~63강 - 최신 JS 문법 (ECMA SCRIPT 6) - 변수선언 키워드 let, const, …
JS-바위
JS 60강 - 인스타그램 (instagram) API - 인스타그램 피드를 웹사이트에 출력
JS-바위
JS 56~59강 - 쿠키 (Cookie) 이용해 「오늘 하루 안보기 팝업창 띄우기」 생성
JS-바위
JS 52~55강 - 멀티플 슬라이드 (Multiple Slideshow)
JS-바위
JS 51강 - 스크롤트리거 (scrollTrigger) - 스크롤 애니메이션 구현
JS-바위
JS 46~50강 - 필터링 반응형 갤러리 (Fitered Gallery)
JS-바위
JS 45강 - 하이라이트 무빙 탭 애니메이션 (Highlight Moving Tab animation)
JS-바위
JS 42~44강 - 풀스크린 슬라이드 (FullScreen Slide) 1 - CSS로만 구현
1/47
제목
내용
제목+내용
and
or
검색
검색
목록
제목
내용
제목+내용
and
or
검색
열린
1
페이지
2
페이지
3
페이지
4
페이지
5
페이지
6
페이지
7
페이지
8
페이지
9
페이지
10
페이지
다음
맨끝
제작의뢰
질문답변
1:1문의
홈
PC버전
로그인
일본어
웹디자인언어
코딩동강
HTML
CSS
JavaScript
jQuery
Bootstrap 3
Bootstrap 4
Bootstrap 5
서버관리언어
PHP
SQL
서버 관리
Python
고급코딩언어
LESS
SCSS
NodeJS
React
Java
C++
C#
Go
R
그누보드
G5코드사전
그누보드5
영카트5
아미나
나리야4
배추5
배추4
배추라이트
배추5 함수
그누보드6
G6코드사전
나리야5
제작의뢰
제작의뢰
포트폴리오
Q&A
1
Q&A
FAQ
1
커뮤니티
2
회원보드
2
Music
빗소리
게임센터
설문투표
고백듣기
유튜브입문
티스토리입문
제안하기
후기쓰기
웹유틸
비율계산기
색상코드변환기
도메인IP추적기
아이피변환기
URL암호기
Tistory 코드
구글맞춤검색
마우스클릭테스트
유튜브확대재생기
전광판
회원센터
공지사항
1:1 문의
등업신청
후원하기
홈짱
PC버전
로그인