mui怎样让popver弹出框始终显示在中间位置
3个回答
展开全部
让popver弹出框始终显示在中间位置 就不要用 <a href='#popver'>,自己写一个标签,比如:
<button type="button" @click="transferOder">转移订单</button>
通过点击事件 控制 popver的显示和<div class="mui-backdrop "></div>的显示
并且在点击事件中控制popver的定位: $('#middlePopover').css('top',$(window).scrollTop()+180)//定位的关键代码
这样不管页面如何滚动 popver始终处于最中间的位置。
############
刚好最近在写一个vue 和mui的项目,mui的popver封装的js是定位点击的位置,不能让他始终在中间,又看了网上各种各样的答案都不太符合,然后自己写了一个。有什么不懂的可以邮件635036447@qq.com
<button type="button" @click="transferOder">转移订单</button>
通过点击事件 控制 popver的显示和<div class="mui-backdrop "></div>的显示
并且在点击事件中控制popver的定位: $('#middlePopover').css('top',$(window).scrollTop()+180)//定位的关键代码
这样不管页面如何滚动 popver始终处于最中间的位置。
############
刚好最近在写一个vue 和mui的项目,mui的popver封装的js是定位点击的位置,不能让他始终在中间,又看了网上各种各样的答案都不太符合,然后自己写了一个。有什么不懂的可以邮件635036447@qq.com
展开全部
尝试设置绝对位置,或者获取当前位置距顶部的位置均不太可用。
后发现mui-bar不受滑动的影响,所以,写一个mui-bar隐藏块,给弹出框绑定即可。
1、写弹出层
<div id="popover" class="mui-popover" style="height: 380px;">
内容
</div>
2、弹出层需要固定的位置(nav相当于绝对位置,不会随着下滑而变动)
<!--定位弹出框到屏幕中间-->
<nav class="mui-bar mui-bar-tab" style="margin: 0 auto;margin-bottom: 40%;border: #6641E2;width: 0px;height: 0px;" id="ta">
</nav>
3、绑定
mui("#popover").popover('toggle', document.getElementById("ta"));
后发现mui-bar不受滑动的影响,所以,写一个mui-bar隐藏块,给弹出框绑定即可。
1、写弹出层
<div id="popover" class="mui-popover" style="height: 380px;">
内容
</div>
2、弹出层需要固定的位置(nav相当于绝对位置,不会随着下滑而变动)
<!--定位弹出框到屏幕中间-->
<nav class="mui-bar mui-bar-tab" style="margin: 0 auto;margin-bottom: 40%;border: #6641E2;width: 0px;height: 0px;" id="ta">
</nav>
3、绑定
mui("#popover").popover('toggle', document.getElementById("ta"));
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
popover显示,按照hello mui 里面的写就行,隐藏可以如下这样写:
mui('#popover').on('tap','a',function(){
mui('#popover').popover('hide');
});
mui('#popover').on('tap','a',function(){
mui('#popover').popover('hide');
});
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询