jssor滑塊添加視頻

我想在我的當前圖像滑塊內添加一個視頻。我不想只播放視頻，而是混合使用視頻和圖像。我已經能夠播放視頻，但我需要添加暫停，播放和停止控制器，並使該幻燈片比其他幻燈片更長。誰能幫幫我嗎？jssor滑塊添加視頻

http://www.piratesdinneradventureca.com/

<!-- Insert Slideshow --> 

<div id="slideshowwrapper"> 
    <div id="slider1_container" style="left: 0px; top: 5px; width: 687px; height: 324px; overflow: visible; position: relative;"> 

    <!-- Slides Container --> 

    <div u="slides" style="cursor: move; position: absolute; left: 0px; top: 0px; width: 687px; height: 324px; overflow: hidden;"> 
<div><a u="image" href="http://www.piratesdinneradventureca.com/special-offers/"><img src="<?php echo get_template_directory_uri(); ?>/images/Halloween-show.png" /></a></div> 
<div><a u="image" href="http://www.piratesdinneradventureca.com/special-offers/"><img src="<?php echo get_template_directory_uri(); ?>/images/After-Summer.png" /></a></div> 
<div><video style="width="687px" height="324px" autoplay> 
    <source src="<?php echo get_template_directory_uri(); ?>/images/PiratesSeaDragon_converted.mp4" type="video/mp4" /> 
    <source src="<?php echo get_template_directory_uri(); ?>/images/PiratesSeaDragon.ogv" type="video/ogg" pHideControls="0" /> 
</video></div>

來源

2014-09-24 Tabatha Jones Wrisley

Jssor滑塊支持YouTube視頻。

<script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script> 
<script type="text/javascript" src="../js/jssor.slider.mini.js"></script> 
<script type="text/javascript" src="../js/jssor.player.ytiframe.min.js"></script>

你可以把一個視頻播放器中的任何幻燈片的格式如下，

  <div u="player" style="position: relative; top: 0px; left: 0px; width: 640px; height: 390px; overflow: hidden;"> 
       <!-- iframe in ebay page is not allowed, youtube iframe video is not supported for ebay listing --> 
       <iframe pHandler="ytiframe" pHideControls="0" width="640" height="390" style="z-index: 0;" url="http://www.youtube.com/embed/H7jtC8vjXw8?enablejsapi=1&version=3&playerapiid=ytplayer&fs=1&wmode=transparent" frameborder="0" scrolling="no"></iframe> 
       <!-- play cover begin (optional, can remove play cover) --> 
       <div u="cover" class="videoCover" style="position: absolute; top: 0px; left: 0px; background-color: #000; background-image: url(../img/play.png); background-position: center center; background-repeat: no-repeat; filter: alpha(opacity=40); opacity: .4; cursor: pointer; display: none; z-index: 1;"></div> 
       <!-- play cover end --> 
       <!-- close button begin (optional, can remove close button) --> 
       <style> 
        .closeButton { background-image: url(../img/close.png); } 
        .closeButton:hover { background-position: -30px 0px; } 
       </style> 
       <div u="close" class="closeButton" style="position: absolute; top: 0px; right: 1px; 
        width: 30px; height: 30px; background-color: #000; cursor: pointer; display: none; z-index: 2;"> 
       </div> 
       <!-- close button end --> 
      </div>

來源

2014-09-25 00:42:56 jssor

，並添加

//fetch and initialize youtube players 
$JssorPlayer$.$FetchPlayers(document.body);

來源

2015-10-17 06:47:19 Vano42

請解釋爲什麼這會工作。 – 2015-10-17 06:59:14

@RohitGupta說了些什麼。此答案已被標記，並顯示在低質量帖子審覈隊列中，因此缺少任何解釋，存在被刪除和丟失的風險。 – sideshowbarker 2015-10-18 04:35:18

jssor滑塊添加視頻

回答

相關問題