2012-09-05 48 views
0

我对Orbit Slider有疑问。在视频中使用轨道滑块

我想在滑块中放置一个YouTube视频。 我用div嵌入取代img并且成功。视频可以播放和停止。

我的问题是我怎样才能让滑块的计时器停止当用户按滑块上的视频PLAY

回答

2

如果你看看Orbit滑块的JavaScript,它使用事件。寻找的在轨道码这些位JS文件

this.$element.bind('orbit.start', function (event, index) { 
    self.startClock(); 
    }); 

    this.$element.bind('orbit.stop', function (event, index) { 
    self.stopClock(); 
    }); 

这些结合事件“orbit.stop”和“orbit.start”事件的HTML元素(使用时通常具有“特色”的ID建立轨道的基础方法)。所以如果你触发这些事件,例如'orbit.stop'从HTML元素中调用函数stopClock()。以下应帮助...

HTML

<a id="stop-button" href="#" class="button rounded">stop</a> 
<a id="start-button" href="#" class="button rounded">start</a> 

的Javascript

$('#stop-button').on('click',function(){ 
    $('#featured').trigger('orbit.stop'); 
}); 

$('#start-button').on('click',function(){ 
    $('#featured').trigger('orbit.start'); 
}); 


/*using the setup 
<div id="featured"> 
    <img src="../images/orbit-demo/demo1.jpg" /> 
    <img src="../images/orbit-demo/demo2.jpg" /> 
    <img src="../images/orbit-demo/demo3.jpg" /> 
</div> 
*/