bxsliderで動画と静止画混在のスライドショー

bxsliderを使用して、動画と静止画混在するスライドショーを作ろうとしています。
動画は再生中スライドショーを停止、動画再生終了後はスライドショー再開をさせたく、

「bxSliderで動画再生終了後にスライドショーを始める」
https://try-m.co.jp/blog/web-create/1365/
を参考にしてみましたが、動画が1枚だけ＆1枚目ならうまくいきますが、複数設置は×。
（数値をいじり、全体の1つだけ動画でしたらうまくできますが、複数設置すると、再生中にスライドしていまい、希望する動作になりませんでした）

「bxSliderで動画をスライドごとに再生」
https://oshiete.goo.ne.jp/qa/9677172.html
動画のみでしたらうまくいきますが、静止画が入ると、そこでスライドショーがとまってしまい、うまくいかない。

bxsliderで動画静止画混在するスライドショー設置する方法はありますでしょうか。
（「Slider Pro」での設置を試みましたが、表示方法等で難点があり、できればbxsliderで設置したいというのがあります。。。）

何かご助言いただけますと幸いです。
（当方、初歩からの勉強中でまったくのド素人ですみません）

No.1 回答者： fujillin 回答日時： 2019/10/01 11:27

こんにちは

ご例示の前者は、動画のあるスライド番号が決まっている場合を想定していて、後者は、全て動画である想定になっているようです。

＞bxsliderで動画静止画混在するスライドショー設置する方法はありますでしょうか。
表示中のパネルが動画か静止画かを調べて、それに応じた処理を行うようにすれば宜しいのではないでしょうか。
（ご例示のものは、あらかじめ決まっているので、調べたりはしていない）

動画をVIDEOタグに固定しても良いとし仮定して、以下は一例です。

$(function(){
let v = $("video", $(".bxslider").children().eq(0));

let slider = $(".bxslider").bxSlider({
infiniteLoop: true,
controls: false,
pager: false,
onSlideAfter: function(elm){
v = $("video", elm);
if(v.length){ slider.stopAuto(); v.get(0).play(); }
}
});

$(".bxslider video").on("ended", function(e){
this.pause();
this.currentTime = 0;
slider.goToNextSlide();
slider.startAuto();
});

if(v.length) v.get(0).play(); else slider.startAuto();
});

※ ブラウザによっては、動画の自動開始が制限されているようです。
　 まずは、muted属性をonにした状態で試してみてください。
　 <video src="～～～.mp4" muted></video>