Ufdjrw

I am trying to use video as a background which works fine & i can loop it but it doesnt work for following

1. 
   loop=1 doesn't loop again from start=180 when video ends



2. same code show video with with play button on iphone but doesnt play the video which i belive autoplay is now blocked by iphone but i cant play the video when i hut play button.




3. how can i only show thumbnail image on YT video without play button




4. Can i loop video between start & end time

CODE

<div class="videobg">
 <div class="videobg-width">
 <div class="videobg-aspect">
 <div class="videobg-make-height">
 <div class="videobg-hide-controls">
 <iframe src="https://www.youtube.com/embed/tOjJ2BhKCnw?controls=0&amp;start=180&amp;autoplay=1&amp;loop=1&amp;playlist=tOjJ2BhKCnw" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
 </div>
 </div>
 </div>
 </div>
</div>



var timeoutId;
var $videoBgAspect = $(".videobg-aspect");
var $videoBgWidth = $(".videobg-width");
var videoAspect = $videoBgAspect.outerHeight() / $videoBgAspect.outerWidth();

function videobgEnlarge() 
 console.log('resize');
 windowAspect = ($(window).height() / $(window).width());
 if (windowAspect > videoAspect) 
 $videoBgWidth.width((windowAspect / videoAspect) * 100 + '%');
 else 
 $videoBgWidth.width(100 + "%")
 


$(window).resize(function() 
 clearTimeout(timeoutId);
 timeoutId = setTimeout(videobgEnlarge, 100);
);

$(function() 
 videobgEnlarge();
);

CodePen: https://codepen.io/anon/pen/XGpXzd