Теги темы WordPress для Parallax не работают только в Google Chrome

Question

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

В последних версиях Chrome вкладки JavaScript / панели навигации не выполняют ожидаемых параллакс-действий / прокрутки.

Я предполагаю, что это, скорее всего, изменение в Chrome и его интерпретация JavaScript, и я смог воспроизвести эти проблемы в версии Chrome 73.0.3683.75 (Официальная сборка) (64-разрядная версия).

Веб-сайт http://www.aircomfortcomplete.com/ - если кто-то сталкивался с этой проблемой или знает, почему Chrome неправильно интерпретирует код, я был бы очень признателен за помощь. Это то, что мне нужно сделать как быстрое решение, прежде чем переписать изменения шаблона в качестве дочерней темы.

По сути, я просто не хочу подвергать остракизму всех своих пользователей Chrome, пока я работаю над правильной дочерней темой.

Спасибо за ваше время и помощь, ребята! =)

-Alexander

Answer 1

Кажется, тема использует старую версию или jquery.nav.js и SmoothScroll.js jQuery, и это создает проблему с последней версией Google Chrome, поэтому, пожалуйста, обновите эти две CSS-копии из репозитория ниже, тогда все будет хорошо в ваших настройках.

Расположение файла:

/ wp-content / themes / accesspress-parallax / js / SmoothScroll.js
/ wp-content / themes / accesspress-parallax / js / jquery.nav.js

Последний jQuery:

https://github.com/gblazex/smoothscroll-for-websites/blob/master/SmoothScroll.js https://github.com/davist11/jQuery-One-Page-Nav/blob/master/jquery.nav.js

Answer 2

Если вы заглянули в консоль разработчика, вы можете увидеть сообщение об ошибке от SmoothScroll.js. В Chrome введено ограничение для прокручивающих прослушивателей событий , если только они не называются непассивными.

Вам необходимо обновить прослушиватели событий, чтобы в Chrome была опция {passive: false}, чтобы соблюдать event.preventDefault () в методе. См. https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener для получения дополнительной информации о методе.

При сканировании кода я думаю, что строка для обновления - это вспомогательная функция addEvent в строке 435 SmoothScroll.js. Может быть, что-то вроде ниже?

function addEvent(type, fn, bubble) {
    window.addEventListener(type, fn, {passive: false, capture: (bubble||false)});
}

Answer 3

Во-первых, вы можете только обновить jquery, чтобы увидеть, сохраняется ли проблема.Если это так, я бы использовал следующее быстрое исправление:

.css файл:

html {
  scroll-behavior: smooth;
}

И в html я бы закомментировал (отключил) ваш плагин с плавной прокруткой.Оставьте ссылки такими, какие они есть, просто убедитесь в том, что warnDefault не вызывается.

<li>
  <a href="http://aircomfortcomplete.com/#section-355">Promos</a>
</li>

<section class="parallax-section clearfix default_template" id="section-355">

  ...

</section>

РЕДАКТИРОВАТЬ: я понимаю, вы хотите знать, какой конкретный метод JavaScript является неправильным.Но я предполагаю, что есть метод, который ведет себя неправильно, и вы не можете решить проблему, заменив его.Я предлагаю использовать быстрое исправление, указанное выше