【tubular.js】mobileサイズ時の切り替えについて

Question

現在制作中のページ背景に、jquery.tubular.1.0で動画を設定したいと思っており、
PCではうまくいったのですが タブレットとスマホの時はあらかじめ用意した写真に切り替える仕様にしたいのですが
プログラムがわかりません。
（同様の質問が以前あったのですが、回答ゼロだったため）
調べたところ、メディアクエリは使えないようです。
皆様のお知恵をどうか頂きたいです。

下記が現在設置中のtubularのスクリプトです。
表記方法のミス等もあるかと思います。どんどん指摘いただければ嬉しいです。

何卒よろしくお願いいたします。

<script src="js/jquery.tubular.1.0.js"></script>
<script src="js/jquery.tubular.1.0.js"></script>
<script>
	$('document').ready(function() {
		var options = { videoId: '9DTsL05QkDA'};
		$('#top_main').tubular(options);
		if(!navigator.userAgent.match(/(iPhone|iPad|iPod|Android)/)){
$(document).ready(function(){
$('#top_main').tubular(
document.getElementById("#top_main").style.display="none"	);
});
}
	});
	</script>

Answer 1

JavaScriptでの制御がわからなかったので、videoタグにて埋め込みました。