移动尺寸上的 Shopify 粘性导航栏未显示？

Question

我有 shopify 商店，上面有 header 导航栏。当屏幕调整为移动尺寸时，我希望这个粘性 header 栏粘在顶部。在我目前的情况下，粘性导航栏在桌面视图上工作，但当屏幕调整大小时它就会消失。我希望这个 header 栏以这种方式粘在顶部

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_sticky_header

请告诉我如何让它粘在移动尺寸上？

Answer 1

用于 w3 学校的代码适用于移动设备。我相信正在发生的事情（如果没有 link 到您的 shopify 网站，我不能 100% 确定）是您的 shopify 主题有 2 个不同的导航栏，而您只将代码应用到桌面栏。将代码应用于另一个 header，因为它没有显示，所以将 class 添加到隐藏元素应该不会导致任何问题。

if (window.pageYOffset >= sticky) {
  header.classList.add("sticky");
  mobileheader.classList.add("sticky");
} else {
  header.classList.remove("sticky");
  mobileheader.classList.remove("sticky");
}

移动尺寸上的 Shopify 粘性导航栏未显示？

Shopify sticky navbar on mobile size is not showing?

css

shopify