ОБНОВЛЕНИЕ
ОП нашел приемлемое решение, используя scrollTo:
<script type="text/javascript">
// <![CDATA[ window.onload = function(){ window.scrollTo(0,0); }// ]]>
</script>
который, кажется, работает, хотя есть небольшая задержка, так что это не очень хорошо, но пока это единственное, что, похоже, сработало.
Итак, чтобы добавить к решению OP, попробуйте:
<script>
// <![CDATA[ document.addEventListener("DOMContentLoaded", function(){ window.scrollTo(0,0); }, false )// ]]>
</script>
Использование window.onload означает, что ваша функция будет вызвана после загрузки всего остального; DOM, изображения, скрипт и т. д.
Использование DOMContentLoaded означает, что ваша функция будет вызываться после загрузки DOM (то есть после загрузки любых фреймов, что обычно является самой медленной частью содержимого DOM). Чего он не ждет, так это сценария, поэтому убедитесь, что вы поместили сценарий YouTube перед этой строкой. Конечно, есть исключения, см. СТАТЬЮ
ОБНОВЛЕНИЕ
Похоже, что причиной может быть событие focus, поэтому вы можете предложить браузеру сосредоточиться на чем-то другом.
- Создайте временный прозрачный ввод во время загрузки страницы.
- Когда страница полностью загружена, используйте обратный вызов для удаления ввода.
На самом деле забыл обновить фрагмент... поэтому он добавлен сейчас.
Попробуйте этот фрагмент ниже. Посмотреть в «Полной странице». Вы должны прокрутить вниз и вправо, потому что без посторонней помощи он не прокрутится.
document.addEventListener('DOMContentLoaded', init, false);
window.load = function() {
var fpt = document.querySelector('.focalPoint');
fpt.parentNode.removeChild(fpt);
}
function init() {
var fpt = document.createElement('input');
document.body.appendChild(fpt);
fpt.classList.add('focalPoint');
if (fpt != document.activeElement) {
fpt.focus();
}
}
.box {
width: 50vw;
/* Arbitrary */
}
.vidWrap {
position: relative;
/* Anchor the iframe's parent */
padding-bottom: 56%;
/* This is for AR 16:9 (ie. wide screen) videos */
padding-top: 20px;
/* Offset to padding-bottom */
height: 0;
/* Makes a tight 'seal' */
overflow-y: hidden;
/* Ensures that edges aren't breached */
overflow-x: hidden;
/* As above */
-webkit-overflow-scrolling: touch;
/* For iOS7 ... not so sure about iOS8 or iOS9 */
bottom: -50vw;
/* Arbitrary. */
left: 50vw;
/* Arbitrary */
}
.vid {
overflow-x: hidden;
/* See above */
overflow-y: hidden;
/* As above */
height: 100%;
/* stretched to the edge of parent */
width: 100%;
/* As above */
position: absolute;
/* Allows control within the parent */
/* These coords will stretch the iframe seemlessly to parent's edges */
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.focalPoint {
visibility: hidden;
opacity: 0;
line-height: 0;
font-size: 0;
border: 0;
outline: 0;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
}
<section class="box">
<div class="vidWrap">
<iframe id="vid1" class="vid" src="http://media6000.dropshots.com/photos/1381926/20170326/023642.mp4" frameborder="0" scrolling="no" height="100%" width="100%" allowfullscreen></iframe>
</div>
</section>
person
zer00ne
schedule
07.11.2015
