[内容]
popover在页面有横向滚动条时显示位置不准确，没把横向滚动位置加上，导致popover内容会超出现有屏幕。
重现步骤
使用类似这样的代码：
mui('#savePopover').popover('toggle',e);<div id="savePopover" class="mui-popover">
<div class="mui-scroll-wrapper">
<div class="mui-media-body" style="padding:0px 16px;">
<div id="selecteddiv" style="text-align:left;"></div>
</div>
</div>
</div>
.mui-popover {
height: 200px;
}
联系方式
[QQ]27331849
4 个回复
j***@163.com (作者)
客户端环境： ios11，微信公众号
1、我用mac上的chrome来浏览这个页面，进行横向滚动和缩放方式，则popover弹出位置是正确的。
代码类似：
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
.....
</div>
</div>
2、但我用Safari来浏览这个页面，也是进行横向滚动，则popover弹出位置不准确
我是用Safari的开发工具中的响应设计模式和模拟用ios11的浏览器来在Safari中测试的。
应该是mui这块代码没兼容iphone。
j***@163.com (作者)
查到有段代码
window.innerWidth
在safari中的值是373
但在chrome中的值是2500
因为这个值的不同，引发bug.
mui需要对不同的浏览器兼容下
window.innerWidth和widow.innerHeight
我的页面开启了 viewport，user-scalable=yes
j***@163.com (作者)
管理员怎么不回复呢，bug明显啊
风大大
把mui-popover代码放到有position定位的父容器外，这样mui-popover就不会继承父容器的定位而被影响。（实践）
<div class="parentContainer">
</div>
<div class="mui-popover mui-bar-popover">
<div class="mui-popover-arrow"></div>
<ul class="mui-table-view">
<li class="mui-table-view-cell"></li>
<li class="mui-table-view-cell"></li>
</ul>
</div>