움짤 mp4 자체버튼 트랙바 > 팁

본문 바로가기
사이트 내 전체검색

움짤 mp4 자체버튼 트랙바

페이지 정보

profile_image
작성자 비타주리
댓글 1건 조회 233회 작성일 22-05-16 15:05

본문

<div id=myDiv style=width:100%;cursor:pointer;overflow:hidden>
    <video id=myVideo style=width:100%;display:block src=https://blog.kakaocdn.net/dn/cavOpG/btrCfnSBtqQ/VvhwYK7dAsViymV2lklxk1/tfile.mp4 autoplay loop muted></video>
    <div id=trackBar style=position:relative;width:0%></div>
</div>

<script>
pixelWidth = 600; // 원본가로
pixelHeight = 338; // 원본세로
barHeight = 10; // 트랙바 세로픽셀
barColor = "#c0000080";
myDiv.style.height = myDiv.offsetWidth * pixelHeight / pixelWidth + "px";
trackBar.style.height = trackBar.style.bottom = barHeight + "px";
trackBar.style.backgroundColor = barColor;
isPlay = 1;
myDiv.onclick = function() {
    myVideo[isPlay ? "pause" : "play"]();
    isPlay = !isPlay;
}
setInterval(function() {
    trackBar.style.width = myVideo.currentTime / myVideo.duration * 100 + "%";
}, 100);
</script>

댓글목록

profile_image

비타주리님의 댓글

비타주리 작성일

회원로그인

회원가입

사이트 정보

회사명 : 회사명 / 대표 : 대표자명
주소 : OO도 OO시 OO구 OO동 123-45
사업자 등록번호 : 123-45-67890
전화 : 02-123-4567 팩스 : 02-123-4568
통신판매업신고번호 : 제 OO구 - 123호
개인정보관리책임자 : 정보책임자명

공지사항

  • 게시물이 없습니다.

접속자집계

오늘
108
어제
88
최대
179
전체
29,912
Copyright © 소유하신 도메인. All rights reserved.