87,907
社区成员
发帖
与我相关
我的任务
分享embed标签播放视频与图片轮播的效果 求助!
做的一个视频和图片轮播的效果，然后套用在公司项目的框架里不能用video去做，然后用的这个embed，一脸懵逼。为什么第三个图图片显示的时候就会被不知道什么东西覆盖。。。层级我都设置了999了，求大佬帮帮我把。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
html, form, body {
height: 100%;
padding: 0px;
margin: 0px;
}
</style>
<script type="text/javascript">
var GGwidth = 670;
var GGheight = 300;
var GGTime = 2333;
var adurls = ['http://localhost:37784/Upload/AD_Info/9999/20180319102045221.jpg',
'http://localhost:37784/Upload/AD_Info/9999/20180322165124967.mp4',//花
'http://localhost:37784/Upload/AD_Info/9999/20180321100902367.mp4',//屏幕
'http://localhost:37784/Upload/AD_Info/9999/20180319101957970.jpg'];
var adtittles = ['2', '2', '2', '2', '1', '2', '1', '1'];
var contentTypes = ['1', '2', '2', '1', '1', '2', '1', '1'];
var count = 0;
var isvideo = 0;
var playvideo = 0;
var isfirst = 1;
var playimgcount = 0;
var isvideo2 = 0;
var firstvideo = 1;
function adCarousel() {
try {
//图片
function animateimg() {
try {
//第一次执行
if (isfirst == 0) {
//isvideo = 0 图片
if (isvideo == 0) {
//是否为视频类型
if (contentTypes[count] == 2) {
isvideo = 1;
playvideo = 1;
return;
} else {
var list = document.getElementById("list");
var video = document.getElementById("video");
var adimg = document.getElementById('adimg');
var admsg = document.getElementById('admsg');
var adembed = document.getElementById('adembed')
adimg.src = adurls[count];
adimg.alt = adtittles[count];
list.style.display = "block";
//adembed.style.display = "none";
video.style.display = "none";
//adimg.style.zIndex = "9999";
list.style.zIndex = "9999";
video.style.zIndex = "1";
document.getElementById("test").innerHTML = ":img count:" + count;
var a = document.getElementById("container").innerHTML;
debugger;
//alert(document.getElementById('container').innerHTML);
if (playimgcount == 1) {
count = parseInt(count) + 1 * 1;
if (count >= adurls.length) {
count = 0;
}
playimgcount = 0;
}
playimgcount = parseInt(playimgcount) + 1 * 1;
}
}
} else {
if (isvideo == 0) {
count = parseInt(count) + 1 * 1;
if (count >= adurls.length) {
count = 0;
}
if (contentTypes[count] == 2) {
isvideo = 1;
playvideo = 1;
}
isfirst = 0;
}
}
} catch (e) {
debugger;
alert(e);
}
}
...全文
请发表友善的回复…
发表回复
qq_15126639 2018-03-25
- 打赏
- 举报
求大佬来个帮帮忙啊~~~~~~
qq_15126639 2018-03-25
- 打赏
- 举报
function setGGVideo(i) {
try {
var ad = document.getElementById("admsg");
ad.style.height = GGheight;
ad.style.width = GGwidth;
//alert(adtittles[i] + ":" + adurls[i]);
var htmlstr = '<OBJECT ID="ObjNRadioPlayer" name="ObjNRadioPlayer" HEIGHT="' + GGheight + 'px " WIDTH="' + GGwidth + 'px " type="application/x-oleobject" CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">';
htmlstr = '<param name="url" id="adparam" value="' + adurls[i] + '"/>';
htmlstr += '<PARAM NAME="AutoStart" VALUE="true" />';
htmlstr += '<PARAM NAME="Balance" VALUE="0" />';
htmlstr += '<PARAM NAME="enabled" VALUE="true" />';
htmlstr += '<PARAM NAME="EnableContextMenu" VALUE="true" />';
htmlstr += '<PARAM NAME="PlayCount" VALUE="1" />';
htmlstr += '<PARAM NAME="rate" VALUE="1" />';
htmlstr += '<PARAM NAME="currentPosition" VALUE="0" />';
htmlstr += '<PARAM NAME="currentMarker" VALUE="0" />';
htmlstr += '<PARAM NAME="invokeURLs" VALUE="false" />';
htmlstr += '<PARAM NAME="baseURL" VALUE="" />';
htmlstr += '<PARAM NAME="stretchToFit" VALUE="-1" />';
htmlstr += '<PARAM NAME="volume" VALUE="50" />';
htmlstr += '<PARAM NAME="mute" VALUE="false" />';
htmlstr += '<PARAM NAME="uiMode" VALUE="None" />';
htmlstr += '<PARAM NAME="windowlessVideo" VALUE="0" />';
htmlstr += '<PARAM NAME="fullScreen" VALUE="false" />';
htmlstr += '<PARAM NAME="enableErrorDialogs" VALUE="false" />';
htmlstr += '<param name="ShowPositionControls" value="false"> ';
htmlstr += '<PARAM NAME="look" VALUE="false">';
htmlstr += '<PARAM NAME="ShowControls" VALUE="false">';
htmlstr += '<PARAM NAME="volume" VALUE="0">';
htmlstr += '<PARAM NAME="wmode" VALUE="Opaque">';
htmlstr += '<embed id="adembed" wmode="Opaque" volume="0" PlayCount="1" rate="1" ShowControls="false" CONTROLS="playbutton" PlayCount="1" filename="' + adurls[i] + '" autostart="true" PlayCount="0" src="' + adurls[i] + '" type="application/x-mplayer2" height="' + GGheight + 'px " WIDTH="' + GGwidth + 'px "></embed>';
htmlstr += '</OBJECT>';
ad.innerHTML = htmlstr;
} catch (e) {
alert(e)
}
}
</script>
<style type="text/css">
#list {
position: relative;
z-index: 2;
}
</style>
</head>
<body>
<div id="test" style="position: absolute; left: 400px; top: 400px; width: 100px;text-align:center; height: 100px; background-color:blue;">
</div>
<div id="container" style="width: 1340px; height: 300px; background-color: red; position: absolute;">
<div id="list" style="left: 300px; width: 670px; height: 300px; position: absolute; ">
<img id="adimg" style="width:670px;height:300px;" src="http://localhost:37784/Upload/AD_Info/9999/20180319102045221.jpg" />
</div>
<div id="video" style="width: 670px; height: 300px; top: 0px; position: absolute; background-color: blue; left: 0px;">
<div id="admsg" style="width: 670px; height: 300px; ">
</div>
</div>
</div>
</body>
</html>
qq_15126639 2018-03-25
- 打赏
- 举报
//视频
function animatevideo() {
try {
if (isfirst == 0) {
if (isvideo == 1) {
if (playvideo == 1) {
var list = document.getElementById("list");
var adimg = document.getElementById('adimg');
var ad = document.getElementById("admsg");
var adparam = document.getElementById("adparam");
var adembed = document.getElementById('adembed')
var video = document.getElementById("video");
setGGVideo(count);
list.style.display = "none";
video.style.display = "block";
//adembed.style.display = "block";
video.style.zIndex = "3";
list.style.zIndex = "1";
playvideo = 0;
isvideo2 = 1;
}
setTimeout(function () {
if (document.getElementById('adembed').playState != null && document.getElementById('adembed').playState != undefined) {
if (document.getElementById('adembed').playState == 10
|| document.getElementById('adembed').playState == 0 || document.getElementById('adembed').playState == 1) {
var video = document.getElementById("video");
video.style.display = "none";
if (isvideo2 == 1) {
count = parseInt(count) + 1 * 1;
isvideo2 = 0;
}
if (count >= adurls.length) {
count = 0;
}
if (contentTypes[count] == 1) {
isvideo = 0;
playvideo = 0;
} else {
var list = document.getElementById("list");
var ad = document.getElementById("admsg");
var adimg = document.getElementById('adimg');
var video = document.getElementById("video");
var adparam = document.getElementById("adparam");
var adembed = document.getElementById('adembed')
setGGVideo(count);
list.style.display = "none";
video.style.display = "block";
video.style.zIndex = "3";
list.style.zIndex = "1";
//adembed.style.display = "block";
count = parseInt(count) + 1 * 1;
}
}
}
}, 200);
}
} else {
if (isvideo == 1) {
document.getElementById("test").innerHTML = ":1count:" + count + ", playState:" + document.getElementById('adembed').playState;
if (document.getElementById('adembed').playState != undefined) {
if (document.getElementById('adembed').playState == 10
|| document.getElementById('adembed').playState == 0 || document.getElementById('adembed').playState == 1) {
count = parseInt(count) + 1 * 1;
if (count >= adurls.length) {
count = 0;
}
if (contentTypes[count] == 1) {
isvideo = 0;
}
else if (contentTypes[count] == 2) {
playvideo = 1;
}
isfirst = 0;
}
} else {
document.getElementById("test").innerHTML = ":2count:" + count + ", ObjNRadioPlayer playState:" + document.getElementById('ObjNRadioPlayer').playState;
if (document.getElementById('ObjNRadioPlayer').playState == 10
|| document.getElementById('ObjNRadioPlayer').playState == 0 || document.getElementById('ObjNRadioPlayer').playState == 1) {
count = parseInt(count) + 1 * 1;
if (count >= adurls.length) {
count = 0;
}
if (contentTypes[count] == 1) {
isvideo = 0;
}
else if (contentTypes[count] == 2) {
playvideo = 1;
}
isfirst = 0;
}
}
}
}
} catch (e) {
debugger;
alert(e);
}
}
var imgtimer;
var videotimer;
function playimg() {
var time = (GGTime > 0) ? GGTime : 2000;
imgtimer = setInterval(function () {
animateimg();
}, time)
//}, (time * 4) / 5)
}
function palyvideo() {
videotimer = setInterval(function () { //每过0.5秒监控一下视频是否正在播放，如果没在播放则顺序播放下一个视频
animatevideo();
}, 500); //每个0.5秒监控一下
}
function play() {
//for (var i = 0; i < adurls.length; i++) {
// alert(i + ":" + adtittles[i] + " , " + contentTypes[i] + "," + adurls[i]);
//}
if (contentTypes[count] == "2") {
isvideo = 1;
} else {
isvideo = 0;
}
playimg();
palyvideo();
}
play();
} catch (e) {
alert(e)
}
}
adCarousel();
