Экранная запись элементов параллакса на веб-странице?

Я пытаюсь просмотреть запись следующего веб-сайта для использования в нашем портфолио:

http://independentsweek.co.uk

Веб-сайт содержит довольно много элементов параллакса, и я использую букмарклет JavaScript для плавной прокрутки страницы. Проблема в том, что букмарклет использует преобразование css для прокрутки страницы, элементы параллакса не параллаксируют.

Есть ли известный метод, на который мне не удалось наткнуться, который одновременно плавно прокручивает страницу, сохраняя параллакс элементов параллакса?

Я планирую использовать QuickTime для записи своего экрана, так как это родная macOS.

Спасибо.


person E.Owen    schedule 26.06.2017    source источник
comment
Почему бы просто не использовать старый добрый захват видео с экрана? И вы можете прокручивать вручную   -  person Jeremy Thille    schedule 26.06.2017
comment
@JeremyThille человеческая прокрутка чертовски дерганая! Мы хотим, чтобы прокрутка была плавной, иначе ее демонстрация теряет смысл.   -  person E.Owen    schedule 26.06.2017
comment
Возможно, вы можете использовать небольшой фрагмент кода с плавной прокруткой: css-tricks.com/snippets/ jquery/гладкая прокрутка   -  person Jeremy Thille    schedule 26.06.2017
comment
@JeremyThille да, у меня есть букмарклет для этого. Когда я запускаю JS с плавной прокруткой, элементы параллакса не параллаксируются, потому что на самом деле это не прокрутка страницы, а использование преобразования CSS.   -  person E.Owen    schedule 26.06.2017
comment
Итак, используйте фрагмент кода jQuery, который действительно будет прокручивать страницу вниз?   -  person Jeremy Thille    schedule 26.06.2017
comment
@JeremyThille Никогда не думал об этом! Просто использовал jQuery scrollTop для прокрутки, и он отлично работал. Спасибо!   -  person E.Owen    schedule 26.06.2017
comment
Не за что, рад, что смог помочь :)   -  person Jeremy Thille    schedule 26.06.2017


Ответы (1)


Вместо того, чтобы использовать Bookmarklet, который внедряет JS для запуска преобразования CSS, я использовал функцию jQuery scrollTop(), прокручивая до идентификатора моего нижнего колонтитула.

Код, который я сейчас использую:

javascript:jQuery('html,body').animate({scrollTop:jQuery("#mastfoot").offset().top},22000);

Надеюсь, кто-то найдет это полезным!

person E.Owen    schedule 26.06.2017