如何在打开 amp-sidebar 时启用滚动
[英]How to enable scroll when amp-sidebar is opened
问题描述
I have a sidebar:
我有一个侧边栏：
<script custom-element="amp-sidebar" src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js" async></script>
<amp-sidebar id="header-sidebar" layout="nodisplay" side="right">
...
</amp-sidebar>
But when sidebar is opened I can't scroll the page.但是当侧边栏打开时，我无法滚动页面。 I see that <html> tag has this class i-amphtml-scroll-disabled .我看到<html>标签有这个类i-amphtml-scroll-disabled 。
#i-amphtml-wrapper.i-amphtml-scroll-disabled,
.i-amphtml-scroll-disabled {
overflow-x: hidden!important;
overflow-y: hidden!important;
}
But I can't use !important in AMP, that's why I can't override these styles.但是我不能在 AMP 中使用!important ，这就是我不能覆盖这些样式的原因。
So how could I enable scrolling on the page when menu is opened?那么如何在打开菜单时启用页面滚动？
1 个解决方案
解决方案1
0 已采纳 2018-07-18 19:51:48
If it is part of the AMP styling, as you have discovered, it can not be overridden or modified.如果它是 AMP 样式的一部分，正如您所发现的，它不能被覆盖或修改。 Doing so will invalidate your page.这样做会使您的页面无效。
In the event your sidebar is too tall for the view-port it will allow for just the sidebar to scroll.如果您的侧边栏对于视口来说太高，它将只允许侧边栏滚动。 See the screenshot below from a site I help maintain - the scrollbar (circled in red) appears when the view-port is shorter than the sidebar.请参阅下面我帮助维护的站点的屏幕截图 - 当视口短于侧边栏时，会出现滚动条（红色圆圈）。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.