トップのカバーに動画を自動再生させたいんです。
→なるなる、それならvideoタグでできますよね。
動画が終わったらスライド画像をいれたいんです。
→おお、、
動画はページ読み込みの最初だけ流して、２周目以降はスライドだけ表示させたいです。
→おおお。。。

boxSliderで動画再生後のスライドを設置されているかたをみつけたので今回はbxSliderを使いました。
bxSliderで動画再生終了後にスライドショーを始める

で、このサイト通り書いたら動画再生後のスライドはできたんですが、
問題は２周目は動画を再生させずに飛ばすっていうところ。
しかし調べてみると、bxSliderにはコールバック関数とかわかりやすくそろっていて、これを使えばいけんじゃないかってことで。
下記完成コードです。

まずhtmlから。

<ul class="bxslider">
	<li><video src="movie.mp4" id="video"></video></li>
	<li><img src="slide01.jpg" alt="スライド１枚目"></li>
	<li><img src="slide02.jpg" alt="スライド2枚目"></li>
	<li><img src="slide03.jpg" alt="スライド3枚目"></li>
</ul>

そしてjs。body閉じタグ直前に。

<script>
jQuery(function() {
	var $video = jQuery('#video').get(0);
	$slider = jQuery('.bxslider').bxSlider({
		infiniteLoop: true,
		mode: 'fade',
		controls: false,
		speed: 2000,
		onSliderLoad : function() { //スライドがロードされたとき動画再生
			$video.play();
		},
		onSlideAfter : function($slideElement, oldIndex, newIndex) { //各スライドの直後
			$video.pause();
			$video.currentTime = 0;
			$slider.startAuto();
		},
		onSlideBefore : function($slideElement, oldIndex, newIndex) {
			if ( oldIndex == 3 ){ //前のスライドが３枚目だったとき
				$slider.goToSlide(1); //スライド１枚目に移動
			}
		}
	});
	$video.addEventListener("play", function() {
		$slider.stopAuto();
	});
	$video.addEventListener("ended", function() {
		$slider.goToNextSlide();
});
});
</script>

wordpressに入れたので、一部$をjQueryに書き換えてます。
onSlideBeforeはスライドの直前に実行されるコールバック関数なので、
前のスライドが３枚目だったとき＝スライド０（最初の動画、２周目以降）のとき、０が表示される前に１に移動させています。
参考サイトでは、毎回動画が再生されるようにif(newindex == 0)として再生のための記載がありましたが、
今回はそれも不要だったので削除しました。
最近Swiperにすっかりお世話になってましたがbxSliderも使いやすいですね＾＾

• bxSlider
• CODING
• jQuery