当弹出窗口处于活动状态时,我如何与离子背景中的项目交互?
How do I interact with items in the background in ionic while a popover is active?
离子版本:1.x
平台:全部
我有一个使用离子弹出窗口的离子应用程序。但是,当弹出窗口处于活动状态(打开)时,我无法再与后台的事物进行交互,例如向下滚动我的项目列表。我已经尝试寻找这个问题的现有答案,但没有看到被问到的问题。
弹出窗口本身不必绑定到页面上的任何活动元素,因为它目前有 position:fixed 并且将始终出现在相同的位置。
所以基本上问题是,有没有办法防止弹出窗口阻止我与后台的所有内容交互?
我发现这个代码笔是有人提出的:
https://codepen.io/ionic/pen/GpCst
这可能有用吗?
.popover-backdrop {
display:none;
}
我找到了答案,但是,不确定是否有更好的方法来做到这一点,也许是打开和关闭与背景交互的选项,但目前答案似乎如下:
- 确保 .popover-backdrop class 的大小和位置(在我的例子中是高度和上边距)与实际的固定弹出窗口元素相同。默认高度为 100%。
- 确保您禁用了 .popover-open class(应用于正文)
pointer-events: none;
- 请记住,这将更改行为,如果您在弹出窗口外单击,默认情况下它将关闭它。所以在 ionic 中,我将必须确保在我离开视图的事件中关闭弹出窗口(如果处于活动状态)。
离子版本:1.x
平台:全部
我有一个使用离子弹出窗口的离子应用程序。但是,当弹出窗口处于活动状态(打开)时,我无法再与后台的事物进行交互,例如向下滚动我的项目列表。我已经尝试寻找这个问题的现有答案,但没有看到被问到的问题。
弹出窗口本身不必绑定到页面上的任何活动元素,因为它目前有 position:fixed 并且将始终出现在相同的位置。
所以基本上问题是,有没有办法防止弹出窗口阻止我与后台的所有内容交互?
我发现这个代码笔是有人提出的:
https://codepen.io/ionic/pen/GpCst
这可能有用吗?
.popover-backdrop {
display:none;
}
我找到了答案,但是,不确定是否有更好的方法来做到这一点,也许是打开和关闭与背景交互的选项,但目前答案似乎如下:
- 确保 .popover-backdrop class 的大小和位置(在我的例子中是高度和上边距)与实际的固定弹出窗口元素相同。默认高度为 100%。
- 确保您禁用了 .popover-open class(应用于正文)
pointer-events: none;
- 请记住,这将更改行为,如果您在弹出窗口外单击,默认情况下它将关闭它。所以在 ionic 中,我将必须确保在我离开视图的事件中关闭弹出窗口(如果处于活动状态)。