Video slideshow

HTML

<link type="text/css" rel="stylesheet" href="jquery.slider.css" />
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript" src="jquery.easing.compatibility.js"></script>
<script type="text/javascript" src="jquery.slider.js"></script>

<div id="slider1" class="slider">
	<div class="slider-box">
		<div class="slider-item">
			<iframe width="600" height="400" src="https://www.youtube.com/embed/OeYnX9NwB1k?rel=0" frameborder="0" allowfullscreen></iframe>
		</div>
		<div class="slider-item">
			<iframe width="600" height="400" src="https://www.youtube.com/embed/fZht--MW2D0?rel=0" frameborder="0" allowfullscreen></iframe>
		</div>
		<div class="slider-item">
			<iframe width="600" height="400" src="https://www.youtube.com/embed/E7H1zrTm7z8?rel=0" frameborder="0" allowfullscreen></iframe>
		</div>
	</div>
	<div class="slider-nav">
		<a href="#"></a>
		<a href="#"></a>
		<a href="#"></a>
	</div>
</div>

Javascript

<script type="text/javascript">
$(function () {
	$("#slider1").slider({
		width: 600,
		height: 400
	});
});
</script>