How to Embed Videos in the Slider ?

You can embed Vimeo, YouTube and HTML5 Videos as Video Captions. Within a video you can set autoplay, autoplay only first time, loop (html5), nocontrol(html5), thumbnails for videos, fullscreen or predefined size.

Important options in Plugin Initialisation:

		<script type="text/javascript">
		var revapi;
		jQuery(document).ready(function() {
			   revapi = jQuery('.tp-banner').revolution(
				{
					delay:9000,
					startwidth:1170,
					startheight:500,
					hideThumbs:10,
					videoJsPath:"rs-plugin/videojs/"

				});
		});
		</script>
		

YouTube Example - AutoPlay and Next Slide at End of the Video turned on

		<div class="tp-caption sft customout"
			data-x="center" data-hoffset="134"
			data-y="center" data-voffset="-6"
			data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:5;scaleY:5;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
			data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
			data-speed="600"
			data-start="1000"
			data-easing="Power4.easeOut"
			data-endspeed="500"
			data-endeasing="Power4.easeOut"
			data-autoplay="true"
			data-autoplayonlyfirsttime="false"
			data-nextslideatend="true"
		>
			<iframe src='http://www.youtube.com/embed/T8--OggjJKQ?enablejsapi=1&html5=1&hd=1&wmode=opaque&controls=1&showinfo=0;rel=0;' width='640' height='360'
			           style='width:640px;height:360px;'>
			</iframe>
			
		</div>
		

Vimeo Example - AutoPlay on First Time and Next Slide at End of the Video turned on.

		<div class="tp-caption sft customout"
			data-x="center" data-hoffset="134"
			data-y="center" data-voffset="-6"
			data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:5;scaleY:5;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
			data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
			data-speed="600"
			data-start="1000"
			data-easing="Power4.easeOut"
			data-endspeed="500"
			data-endeasing="Power4.easeOut"
			data-autoplay="true"
			data-autoplayonlyfirsttime="true"
			data-nextslideatend="true"
		>
			<iframe src='http://player.vimeo.com/video/76512663?title=0&byline=0&portrait=0;api=1' width='640' height='360'
			           style='width:640px;height:360px;'>
			</iframe>
			
		</div>
		

HTML5 Example - Autoplay On, Loop but with Controls, and in Fullscreen.

		<div class="tp-caption sft customout fullscreenvideo"
			data-x="center" data-hoffset="134"
			data-y="center" data-voffset="-6"
			data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:5;scaleY:5;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
			data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
			data-speed="600"
			data-start="1000"
			data-easing="Power4.easeOut"
			data-endspeed="500"
			data-endeasing="Power4.easeOut"
			data-autoplay="true"
			data-autoplayonlyfirsttime="true"
			data-nextslideatend="true"
		>
			<video class="video-js vjs-default-skin" preload="none" loop  controls width="100%" height="100%"
			      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" />
			  </video>
			
		</div>
		

YouTube Example - With Thumbnail Image over Video

		<div class="tp-caption sft customout"
			data-x="center" data-hoffset="134"
			data-y="center" data-voffset="-6"
			data-customin="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:5;scaleY:5;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
			data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;"
			data-speed="600"
			data-start="1000"
			data-easing="Power4.easeOut"
			data-endspeed="500"
			data-endeasing="Power4.easeOut"
			data-autoplay="true"
			data-autoplayonlyfirsttime="false"
			data-nextslideatend="true"
			data-thumbimage="../examples&source/images/bg3.jpg"
		>
			<iframe src='http://www.youtube.com/embed/T8--OggjJKQ?enablejsapi=1&html5=1&hd=1&wmode=opaque&controls=1&showinfo=0;rel=0;' width='640' height='360'
			           style='width:640px;height:360px;'>
			</iframe>
			
		</div>