/*типа запрет ротации моб устройства*/
@media only screen and (min-width: 415px) and (max-width: 1279px) {
body{display:none} html:before{content:'Переверните устройство в портретный режим или откройте сайт с компьютера.';position:fixed;top:0;left:0;right:0;bottom:0;margin:auto;background:#fff;z-index:999;text-align:center;width:80%;height:100px}
}
./файлы scss и js лежат в одной папке
img{
object-fit: cover;
width: 100px;
height: 100px;
}
// Получаем координаты элемента относительно вьюпорта,
// https://developer.mozilla.org/ru/docs/Web/API/Element/getBoundingClientRect
const elementCoordinates = document.querySelector('.YOUR_CLASS'). getBoundingClientRect();
// Высчитываем скролл вьюпорта
const windowScroll = window.pageYOffset || document.documentElement.scrollTop;
window.scrollTop = elementCoordinates.top + windowScroll;
<script>
$(document).on('click', '#close_vid', function() {
jQuery("iframe").each(function() {
jQuery(this)[0].contentWindow.postMessage('{"event":"command","func":"pauseVideo","args":""}', '*')
});
});
</script>
<script>
$(document).on('click', '#play_video', function() {
jQuery("iframe").each(function() {
jQuery(this)[0].contentWindow.postMessage('{"event":"command","func":"playVideo","args":""}', '*')
});
});
</script><script>
function toggleVideo(state) {
// if state == 'hide', hide. Else: show video
var div = document.getElementById("popupVid");
var iframe = div.getElementsByTagName("iframe")[0].contentWindow;
div.style.display = state == 'hide' ? 'none' : '';
func = state == 'hide' ? 'pauseVideo' : 'playVideo';
iframe.postMessage('{"event":"command","func":"' + func + '","args":""}', '*');
}
</script>
<p><a href="javascript:;" onClick="toggleVideo();">Click here</a> to see my presenting showreel, to give you an idea of my style - usually described as authoritative, affable and and engaging.</p>
<!-- popup and contents -->
<div id="popupVid" style="position:absolute;left:0px;top:87px;width:500px;background-color:#D05F27;height:auto;display:none;z-index:200;">
<iframe width="500" height="315" src="http://www.youtube.com/embed/T39hYJAwR40?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
<br /><br />
<a href="javascript:;" onClick="toggleVideo('hide');">close</a>