ScrollTop в полноэкранном jQuery
Когда браузер находится в обычном режиме, пользователь может нажать кнопку и перейти к блоку div вверху страницы:
$('html,body').animate({scrollTop:$('.backTop').offset().top}, 150);
https://jsfiddle.net/f6xr93b7/
Но имея браузер в полноэкранном режиме, не работает
нет, я хочу, чтобы вы прокрутили вверх, если это нормальный или полноэкранный режим.
Так работает только в нормальной теме, на весь экран ничего не происходит.
Вам не нужно проверять, полноэкранный он или нет. jQuery найдет позицию элемента независимо от того, в каком режиме вы находитесь. Он не работает в полноэкранном режиме, потому что у вас буквально есть условие (если), которое говорит, что если он не в полноэкранном режиме, прокрутите вверх. Избавьтесь от var и if, просто оставьте строку .animate ..
проблема не в этом, я уже удалил if для тестирования, но он все еще не работает
Если у вас возникнет такая проблема, убедитесь, что в следующий раз вы будете использовать полный код.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Я думаю, это то, что вы ищете. Прежде всего вам нужно установить гиперссылку на раздел, который вы хотите прокрутить. В моем случае это #top. Затем несколько кодов jquery для плавной прокрутки.
Run the sippet, Go the bottom of the page ( to the blue coloured section). Click on the white box on bottom, right .
// Add smooth scrolling to all links
$("a").on('click', function(event) {
// Make sure this.hash has a value before overriding default behavior
if (this.hash !== "") {
// Prevent default anchor click behavior
event.preventDefault();
// Store hash
var hash = this.hash;
// Using jQuery's animate() method to add smooth page scroll
// The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function() {
// Add hash (#) to URL when done scrolling (default click behavior)
window.location.hash = hash;
});
} // End if
});#top {
height: 300px;
width: 100%;
background: red;
}
#second {
height: 300px;
width: 100%;
background: blue;
}
.icon {
height: 30px;
width: 30px;
position: fixed;
bottom: 20px;
right: 20px;
background: white;
}<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id = "top">
</div>
<div id = "second">
</div>
<a href = "#top">
<div class = "icon">
</div>
</a>@sNniffer Что вы подразумеваете под полноэкранным режимом. Если раздел отображается в полноэкранном режиме, вы не попадете в раздел. Вы можете подробнее рассказать о своей проблеме, сэр?
простой, полноэкранный режим, мой друг jsfiddle.net/sirfizx/2jkt3z5e, просто нажав кнопку в полноэкранном режиме, экран будет направлен в div, то же самое, что вы сказали, но в полноэкранном режиме. Заголовок сообщения именно такой
Значит, вы здесь используете iframe? Не могли бы вы обновить вопрос своим HTML-кодом?
Я не уверен в вашем вопросе. Когда я проверяю ваш код, я вижу, что ваш html в полноэкранном режиме находится внутри iframe. Так что вопрос не только в ScrollTop, а в ScrollTop внутри iframe. Я просмотрел несколько примеров и не смог найти ответа. Мне это кажется немного новым. Так что на это нужно время. Я дам вам знать, если найду какое-нибудь решение.
Вы можете почерпнуть некоторые идеи здесь: stackoverflow.com/questions/1852518/…
Решено:
Просто используя:
$('html,body').animate({scrollTop:$('.backTop').offset().top}, 150);
назначал прокрутку тела, но должен назначать прокрутку div, которая находится в полноэкранном режиме, получая:
(Сначала нам нужно поместить прокрутку в начало, чтобы правильно измерить смещение)
$('#leitor').scrollTop(0);
$('#leitor').animate({
scrollTop: $(".backTop").offset().top
}, 150);
Вы хотите, чтобы он не прокручивался вверх, если он находится в полноэкранном режиме? Что не так с тем, что вы пробовали?