为了账号安全,请及时绑定邮箱和手机立即绑定

H5上面套用SUI发现的一个问题

我直接用了SUI的popup

http://m.sui.taobao.org/components/#popup

然后遇到了一个问题

我打开的popup会有一个蒙层 蒙层我想要但是他覆盖了我的popup连popup上面的按钮都按不了。

这是蒙层

.popup-overlay.modal-overlay-visible {

   visibility: visible;

   opacity: 1;

}

sm.css:2716

.popup-overlay {

   z-index: 10200;

}

sm.css:2697

.modal-overlay, .preloader-indicator-overlay, .popup-overlay {

   position: absolute;

   left: 0;

   top: 0;

   width: 100%;

   height: 100%;

   background: rgba(0, 0, 0, 0.4);

   z-index: 10600;

   visibility: hidden;

   opacity: 0;

   -webkit-transition-duration: 400ms;

   transition-duration: 400ms;

}

他好像是JS生成的

这是POPUP

.popup, .login-screen {

   position: absolute;

   left: 0;

   top: 0;

   width: 100%;

   height: 100%;

   z-index: 10400;

   background: #fff;

   box-sizing: border-box;

   display: none;

   overflow: auto;

   -webkit-overflow-scrolling: touch;

   -webkit-transition-property: -webkit-transform;

   transition-property: transform;

   -webkit-transform: translate3d(0, 100%, 0);

   transform: translate3d(0, 100%, 0);

}

弄了好久还是搞不懂为啥 这是这样的上次遇到过,然后也没有处理,只是换了一种方式,但是现在要求半屏上次的不行了 只能用蒙层了http://img1.sycdn.imooc.com//590aed050001599b03540585.jpg

正在回答

5 回答

在动态模板上使用popup组件,仅仅加class和dom是不行的,也需要用动态模板的方式创建popup,参看官方文档

动态的 Popup


0 回复 有任何疑惑可以回复我~
$(document).on('click','.create-popup', function () {   var popupHTML = '<div class="popup">'+                     '<div class="content-block">'+                       '<p>Popup created dynamically.</p>'+                       '<p><a href="#" class="close-popup">Close me</a></p>'+                     '</div>'+                   '</div>'   $.popup(popupHTML); });


0 回复 有任何疑惑可以回复我~

是“z-index值太高了”。

0 回复 有任何疑惑可以回复我~

"打开的popup会有一个蒙层 蒙层我想要但是他覆盖了我的popup连popup上面的按钮都按不了",如何解决?

0 回复 有任何疑惑可以回复我~

z-index值太高了

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

H5上面套用SUI发现的一个问题

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信