ScrollTo() и jquery scrollTop() не работают в Chrome

Я делаю платформер-головоломку, используя html-элементы в качестве препятствий. Некоторые уровни я хочу начать в нижней части документа. Поэтому я попытался использовать

$(document).ready(function() {
    $(document).scrollTop($(document).height() - $(window).height());
}

а также

$(document).ready(function() {
    window.scrollTo(0, document.body.scrollHeight);
}

они оба отлично работают в Firefox, но не работают в Chrome. Я мог заставить его работать только при анимации прокрутки, которая не будет работать для того, что я пытаюсь сделать.

edit: я не использую jQuery.toScroll(). Я пробовал vanilla toScroll и jQuery.scrollTop().

Укажите, с какой версией jQuery и браузера вы столкнулись.

thex 07.04.2019 03:09

Возможный дубликат $.scrollTo не работает в Chrome

recnac 12.04.2019 06:38
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
2
3 058
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Я не проводил полное тестирование, но у меня также возникла проблема с помощью инструментов разработчика, по крайней мере, в определенной версии jQuery и последней версии Chrome. animate работает. scrollTop и scrollTo не работают. Тем не менее, даже если вы прямо сказали, что не хотите использовать анимацию, я все равно рекомендую ее, поскольку она работает, и я не вижу причин не использовать ее, если вы используете ее следующим образом:

$('html, body').animate({scrollTop: 500}, 0);

Это будет прокручиваться до 500 пикселей и вообще не будет анимации, потому что продолжительность установлена ​​​​на 0. Я также должен указать на предыдущую проблему с Chrome:

Возможный дубликат

Выпуск на Github

Я знаю, что проблема закрыта, но она может быть актуальной, и, вероятно, о ней следует сообщить, потому что есть что-то подозрительное.

Я пробовал это, и это не работает, когда для анимации установлено значение 0, 0,1, кажется, работает, но это не кажется очень элегантным.

Truce 07.04.2019 04:02

@Truce 0 действительно работает, я пробовал его до того, как опубликовал этот ответ, по крайней мере, в версии jQuery, которую я тестировал.

thex 07.04.2019 19:43
Ответ принят как подходящий

Браузеры прикрепляют свои полосы прокрутки к странице по-разному. Используйте $('html,body').scrollTop(). Вы также должны использовать $(window).innerHeight(). Так...

$('html,body').scrollTop($(document).height() - $(window).innerHeight());

//Or to smooth scroll it

$('html,body').animate({
  scrollTop: $(document).height() - $(window).innerHeight()
}, 1000);

Примечание. $(document).height() вернет то же значение, что и $(window).innerHeight(), если документ короче окна.

Я обнаружил, что проблема в том, что я использовал jQuery 2 :( Я не знаю почему, потому что все мои другие проекты используют самую новую версию. В любом случае спасибо за помощь!

Truce 07.04.2019 06:28

Я также должен отметить, что $(document).height() вернет то же самое, что и $(window).innerHeight(), если документ короче окна. Для ваших целей это не имеет значения, поскольку цель состоит в том, чтобы просто прокрутить вниз, и если документ короче, чем окно, вы все равно уже находитесь внизу.

KFish 07.04.2019 18:53

Другие вопросы по теме