cd 무지개 플레이어 > 팁

본문 바로가기
  • 메뉴 준비 중입니다.

사이트 내 전체검색

뒤로가기

cd 무지개 플레이어

페이지 정보

작성자 비타주리 작성일 22-07-30 03:16 조회 2,739 댓글 0

본문

<style>
#container { width:100%; }
#aside { display:none; }
#cdDiv { display:block; position:relative; width:100%; max-width:960px; margin:0 auto; }
#cdDiv img { display:block; width:100%; }
#cdDiv video { display:block; width:100%; position:absolute; top:0px; mix-blend-mode:screen; }
#cdDiv div { position:absolute; width:30px; height:30px; overflow:hidden; box-sizing:initial; border-radius:50%; border:1px solid #cccccc; left:50%; top:50%; transform:translate(-50%,-50%); opacity:0.8; }
#cdDiv audio { height:30px; margin-left:-11px; }
</style>

<div id=cdDiv></div>

<script>
cdUrl = "https://blog.kakaocdn.net/dn/bllq1E/btrIxA6Cv2s/tFlIHq5TqV7WeIKMWpaI1k/tfile.mp4";
cdAlpha = 0.5;
imageUrl = "https://blog.kakaocdn.net/dn/bQtvvm/btrIwGywwbO/NGEmmg9r1p6VSnZwKIJdGK/img.jpg";
mp3Url = "https://blog.kakaocdn.net/dn/bktrp1/btrIhjvw0vq/wlFVLfGPuZZpvrsPFztxpk/tfile.mp3";
effectUrl = "https://blog.kakaocdn.net/dn/bpXF96/btryk1TnjMO/O3Bktqqi3VVBEKeOXu0UTK/tfile.mp4";
cd_1 = "<img src='" + imageUrl + "'>";
cd_2 = "<video style=opacity:" + cdAlpha + " src='" + cdUrl + "' autoplay loop muted></video>";
cd_3 = effectUrl == "" ?"" :  "<video src='" + effectUrl + "' autoplay loop muted></video>";
cd_4 = "<div><audio src='" + mp3Url + "' autoplay loop controls></audio></div>";
cdDiv.innerHTML = cd_1 + cd_2 + cd_3 + cd_4;
cdDiv.removeAttribute("title");
</script>

댓글목록 0

등록된 댓글이 없습니다.

Copyright © 소유하신 도메인. All rights reserved.

사이트 정보

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

PC 버전으로 보기