Shopify | Дебютная тема stati c отказов заголовка - PullRequest
0 голосов
/ 07 января 2020

Я редактирую тему дебюта на Shopify. Я хотел сделать заголовок stati c, поэтому я нашел этот урок здесь: https://community.shopify.com/c/Shopify-Design/Sticky-Fixed-Header-and-Navigation-for-Debut-Theme/m-p/518018/highlight/true#M132407

Все работает, как задумано, до тех пор, пока весь контент не будет загружен, и в этот момент он " отскакивает ", чтобы расположить основной контент под заголовком. Я попытался найти причину и понял, что удаление $(window).on("load", headerSize); из приведенного ниже кода останавливает его, но не перемещает его. Я понятия не имею, как использовать JavaScript, и я предполагаю, что мне нужно установить более короткую анимацию или какой-либо таймер для существующего кода, чтобы загрузить страницу мгновенно или без уведомления пользователя об отказе.

JavaScript:

function headerSize() {
  var $headerHeight = $('div#shopify-section-header').outerHeight();
  $('#PageContainer').css('padding-top', $headerHeight);
}

$(window).on("load", headerSize);
$(window).on("resize", $.debounce(500, headerSize));

1 Ответ

0 голосов
/ 08 января 2020

Самый простой способ достичь желаемого - добавить в конец файла css следующее:

#shopify-section-header {
  z-index: 999999;
  position:fixed;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...