0

video.js 你好。我正在尝试在滑块启动时自动播放视频。那部分正在工作。尽管当它循环播放并返回视频时，会出现问题，但视频不会重播。我试图用 loop="true" 来解决这个问题，但如果我这样做，它只会一遍又一遍地播放视频，然后滑块就不起作用了。有什么建议吗？谢谢！（如果需要，我可以添加我的代码）

<meta charset="utf-8">

<title>AnythingSlider Video Demo</title>
<link rel="shortcut icon" href="demos/images/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="demos/images/apple-touch-icon.png">

<!-- jQuery (required) -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')</script>

<!-- Demo stuff -->

<link rel="stylesheet" href="demos/css/page.css">

<!-- Anything Slider optional plugins, but needed so the embeded video controls will work in IE -->
<!-- http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js -->
<script src="js/swfobject.js"></script>

<!-- Anything Slider -->
<link href="video-js.css" rel="stylesheet" type="text/css">

<link rel="stylesheet" href="css/anythingslider.css">
<script src="js/jquery.anythingslider.js"></script>

<!-- AnythingSlider video extension; optional, but needed to control video pause/play -->
<script src="js/jquery.anythingslider.video.js"></script>

<script>
// DOM Ready
$(function(){
$('#slider')
.anythingSlider({
resizeContents      : true,
autoPlay            : true,
addWmodeToObject    : 'opaque',
buildStartStop: false,  
navigationFormatter : function(index, panel){ //  Format navigation labels with text
return [][index - 1];

}
})


// Initialize video extension

// see https://developers.google.com/youtube   /player_parameters?hl=en#Parameters for a list of parameters

.anythingSliderVideo({
startPanel          : 1,
// video id prefix; suffix from    
$.fn.anythingSliderVideo.videoIndex
videoId : 'asvideo',
// auto load YouTube api script
youtubeAutoLoad : false,
wmode: 'transparent&autoplay=1', // (hack) add autoplay code here
// see: https://developers.google.com/youtube    /player_parameters#Parameters
youtubeParams: {
modestbranding : 1,
iv_load_policy : 3,    
fs : 1  
}
});
});
</script>
<script src="video.js"></script>

<!-- Unless using the CDN hosted version, update the URL to the Flash SWF -->

<script>
videojs.options.flash.swf = "video-js.swf";
</script>
</head>

<body>

<!-- START AnythingSlider -->
<ul id="slider">    

<!-- HTML5 Video -->
<li class="panel5">
<video id="example_video_1" class="video-js vjs-default-skin" controls autoplay preload="auto" autoplay="true" width="640" height="264"
poster="http://video-js.zencoder.com/oceans-clip.png"
data-setup="{}">
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
<track kind="captions" src="demo.captions.vtt" srclang="en" label="English">    
</track><!-- Tracks need an ending tag thanks to IE9 -->
</video>
</li>
 <li><img src="demos/images/slide-civil-1.jpg" alt=""></li>

<li><img src="demos/images/slide-env-1.jpg" alt=""></li>

<li><img src="demos/images/slide-civil-2.jpg" alt=""></li>

<li><img src="demos/images/slide-env-2.jpg" alt=""></li>

</ul> <!-- END AnythingSlider -->

<br>

</div>

<br>
4

1 回答 1

1

您可以将<video>标签的自动播放参数添加到“自动播放”而不是 true。这对我使用任何滑块都有效。

于 2013-09-09T21:24:40.310 回答