mp4 동영상 리스트 플레이어
페이지 정보
본문
<script>
mediaList_1 = ["http://blog.jinbo.net/attach/7133/2175785934.mp4", "마마무 (MAMAMOO) - Decalcomanie (데칼코마니)"];
mediaList_2 = ["http://blog.jinbo.net/attach/7133/4078341425.mp4", "Faithless - Insomnia (Kapral Remix)"];
mediaList_3 = ["http://blog.jinbo.net/attach/7133/1653064732.mp4", "Dalshabet(달샤벳) - B.B.BI(비비비)(Big Baby Baby)"];
mediaList_4 = ["http://blog.jinbo.net/attach/7133/4785662507.mp4", "EXID - Hot Pink [Color coded Han Rom Eng lyrics]"];
mediaList_5 = ["http://blog.jinbo.net/attach/7133/2090555629.mp4", "GIRL'S DAY(걸스데이) - Something (Dance ver.)"];
mediaGap = 4;
headImage = "https://blog.kakaocdn.net/dn/Qlbbm/btq8wechKEh/lX1NqoSY0xS5mQ7q8qJoVk/img.jpg";
footImage = "https://blog.kakaocdn.net/dn/bjkleD/btq8yevGYKv/h92GBFxkRPFjfixZuO50P1/img.jpg";
</script>
<style>
@import url(http://cdn.jsdelivr.net/font-nanum/1.0/nanumbarungothic/nanumbarungothic.css);
#titleTable { color:#000000; font-family:'Nanum Barun Gothic'; padding:12px; background-color:#d5e6f9; border:1px solid #cccccc; }
.listTd { color:#000000; font-family:'Nanum Barun Gothic'; padding:12px; text-align:center; cursor:pointer; }
</style>
<script>
for (mediaTotal = 0; this["mediaList_" + (mediaTotal + 1)]; mediaTotal++);
goMode = 1;
function playerMode() {
playerDiv.innerHTML = "<video style=width:100%;display:block;margin-top:" + mediaGap + "px;margin-bottom:" + mediaGap + "px src=" + this['mediaList_' + (arguments[0])][0] + " controls autoplay controlsList=nodownload onended=mediaMode(goMode?'next':'prev')></video>";
listTitle.innerHTML = "<strong>" + this['mediaList_' + (arguments[0])][1] + "</strong>";
for (media = 1; media <= mediaTotal; media++) {
if (media == mediaNumber) {
this["listMedia_" + media].innerHTML = "<strong>" + this['mediaList_' + media][1] + "</strong>";
this["listMedia_" + media].style.backgroundColor = '#f7d7e4'
}
else {
this["listMedia_" + media].innerHTML = this['mediaList_' + media][1];
this["listMedia_" + media].style.backgroundColor = '#eeeeee';
}
}
}
function mediaMode() {
if (arguments[0] == 'next') playerMode(mediaNumber = mediaNumber == mediaTotal ? 1 : mediaNumber + 1), goMode = 1;
else if (arguments[0] == 'prev') playerMode(mediaNumber = mediaNumber == 1 ? mediaTotal : mediaNumber - 1), goMode = 0;
else playerMode(mediaNumber = arguments[0]);
}
</script>
<div id=mediaDiv>
<div id=headSkin></div>
<table id=titleTable style=width:100% cellpadding=0 cellspacing=0>
<td style=text-align:left;cursor:pointer onclick=mediaMode('prev') onmouseover=style.color='#c00000' onmouseout=style.color='#000000'>◀◀</td>
<td id=listTitle style=text-align:center></td>
<td style=text-align:right;cursor:pointer onclick=mediaMode('next') onmouseover=style.color='#c00000' onmouseout=style.color='#000000'>▶▶</td>
</table>
<div id=playerDiv oncontextmenu='return false' onselectstart='return false' ondragstart='return false'></div>
<table id=listTable style=width:100%;background-color:#cccccc cellpadding=0 cellspacing=1>
<script>
for (media = 1; media <= mediaTotal; media++) {
document.write("<tr><td id=listMedia_" + media + " class=listTd></td></tr>");
this["listMedia_" + media].listNumber = media;
this["listMedia_" + media].onclick = function() { mediaMode(this.listNumber); }
this['listMedia_' + media].onmouseover = function() { this.style.color = '#c00000'; }
this['listMedia_' + media].onmouseout = function() { this.style.color = '#000000'; }
}
titleTable.style.fontSize = listTable.style.fontSize = ("win16win32win64macmacintel").indexOf(navigator.platform.toLowerCase()) < 0 ? '12px' : '16px';
</script>
</table>
<div id=footSkin></div>
<script>
if (typeof headImage != "undefined") headSkin.innerHTML = "<img src=" + headImage + " style=width:100%;display:block;margin-bottom:" + mediaGap + "px>";
if (typeof footImage != "undefined") footSkin.innerHTML = "<img src=" + footImage + " style=width:100%;display:block;margin-top:" + mediaGap + "px>";
listMedia_1.onclick();
</script>
</div>
mediaList_1 = ["http://blog.jinbo.net/attach/7133/2175785934.mp4", "마마무 (MAMAMOO) - Decalcomanie (데칼코마니)"];
mediaList_2 = ["http://blog.jinbo.net/attach/7133/4078341425.mp4", "Faithless - Insomnia (Kapral Remix)"];
mediaList_3 = ["http://blog.jinbo.net/attach/7133/1653064732.mp4", "Dalshabet(달샤벳) - B.B.BI(비비비)(Big Baby Baby)"];
mediaList_4 = ["http://blog.jinbo.net/attach/7133/4785662507.mp4", "EXID - Hot Pink [Color coded Han Rom Eng lyrics]"];
mediaList_5 = ["http://blog.jinbo.net/attach/7133/2090555629.mp4", "GIRL'S DAY(걸스데이) - Something (Dance ver.)"];
mediaGap = 4;
headImage = "https://blog.kakaocdn.net/dn/Qlbbm/btq8wechKEh/lX1NqoSY0xS5mQ7q8qJoVk/img.jpg";
footImage = "https://blog.kakaocdn.net/dn/bjkleD/btq8yevGYKv/h92GBFxkRPFjfixZuO50P1/img.jpg";
</script>
<style>
@import url(http://cdn.jsdelivr.net/font-nanum/1.0/nanumbarungothic/nanumbarungothic.css);
#titleTable { color:#000000; font-family:'Nanum Barun Gothic'; padding:12px; background-color:#d5e6f9; border:1px solid #cccccc; }
.listTd { color:#000000; font-family:'Nanum Barun Gothic'; padding:12px; text-align:center; cursor:pointer; }
</style>
<script>
for (mediaTotal = 0; this["mediaList_" + (mediaTotal + 1)]; mediaTotal++);
goMode = 1;
function playerMode() {
playerDiv.innerHTML = "<video style=width:100%;display:block;margin-top:" + mediaGap + "px;margin-bottom:" + mediaGap + "px src=" + this['mediaList_' + (arguments[0])][0] + " controls autoplay controlsList=nodownload onended=mediaMode(goMode?'next':'prev')></video>";
listTitle.innerHTML = "<strong>" + this['mediaList_' + (arguments[0])][1] + "</strong>";
for (media = 1; media <= mediaTotal; media++) {
if (media == mediaNumber) {
this["listMedia_" + media].innerHTML = "<strong>" + this['mediaList_' + media][1] + "</strong>";
this["listMedia_" + media].style.backgroundColor = '#f7d7e4'
}
else {
this["listMedia_" + media].innerHTML = this['mediaList_' + media][1];
this["listMedia_" + media].style.backgroundColor = '#eeeeee';
}
}
}
function mediaMode() {
if (arguments[0] == 'next') playerMode(mediaNumber = mediaNumber == mediaTotal ? 1 : mediaNumber + 1), goMode = 1;
else if (arguments[0] == 'prev') playerMode(mediaNumber = mediaNumber == 1 ? mediaTotal : mediaNumber - 1), goMode = 0;
else playerMode(mediaNumber = arguments[0]);
}
</script>
<div id=mediaDiv>
<div id=headSkin></div>
<table id=titleTable style=width:100% cellpadding=0 cellspacing=0>
<td style=text-align:left;cursor:pointer onclick=mediaMode('prev') onmouseover=style.color='#c00000' onmouseout=style.color='#000000'>◀◀</td>
<td id=listTitle style=text-align:center></td>
<td style=text-align:right;cursor:pointer onclick=mediaMode('next') onmouseover=style.color='#c00000' onmouseout=style.color='#000000'>▶▶</td>
</table>
<div id=playerDiv oncontextmenu='return false' onselectstart='return false' ondragstart='return false'></div>
<table id=listTable style=width:100%;background-color:#cccccc cellpadding=0 cellspacing=1>
<script>
for (media = 1; media <= mediaTotal; media++) {
document.write("<tr><td id=listMedia_" + media + " class=listTd></td></tr>");
this["listMedia_" + media].listNumber = media;
this["listMedia_" + media].onclick = function() { mediaMode(this.listNumber); }
this['listMedia_' + media].onmouseover = function() { this.style.color = '#c00000'; }
this['listMedia_' + media].onmouseout = function() { this.style.color = '#000000'; }
}
titleTable.style.fontSize = listTable.style.fontSize = ("win16win32win64macmacintel").indexOf(navigator.platform.toLowerCase()) < 0 ? '12px' : '16px';
</script>
</table>
<div id=footSkin></div>
<script>
if (typeof headImage != "undefined") headSkin.innerHTML = "<img src=" + headImage + " style=width:100%;display:block;margin-bottom:" + mediaGap + "px>";
if (typeof footImage != "undefined") footSkin.innerHTML = "<img src=" + footImage + " style=width:100%;display:block;margin-top:" + mediaGap + "px>";
listMedia_1.onclick();
</script>
</div>
◀◀ | ▶▶ |
- 이전글좌우형 슬라이드 갤러리 - 바닐라 스크립트 21.08.14
- 다음글전후진 갤러리(9장) + 사운드 + 파티클 + 효과음 21.06.25