jQuery Mobile弹窗效果

<div data-role="header" data-theme="a" class="themeBackground">
            <a href="#windows" data-rel="popup" data-role="none"><img src="../static/icon/shaixuan.png" style="float:left;margin-top:5px;margin-left:4px;"></a>
            <h1 style="display: inline-block;">约吃广场</h1>
            <img src="../static/icon/fabu.png" style="float:right;margin-top:5px;margin-right:4px;">

            <div id="windows" data-role="popup" style="margin-left:54px;margin-top:145px">
                <ul style="list-style-type:none;padding:77px;margin:0px;">
                        <li style="height: 30px;"  >  
                            <a data-ajax="false"  onclick="view1();" >
                                <span style="vertical-align:middle;" >只看未约</span>
                            </a>
                        </li>
                        <li style='height: 30px;'>   
                            <a data-ajax="false" onclick="view2();">
                                <span style="vertical-align:middle;">只看已约</span>                            
                            </a>
                        </li> 
                        <li style="height:30px;">
                            <a data-ajax="false" id="appeal" style="text-decoration:none;">
                                <span style="vertical-align:middle;">取消</span>                           
                            </a>
                        </li>
                   </ul>
            </div>
        </div>

jQuery Mobile弹窗关键代码:

<a href="#windows" data-rel="popup" data-role="none">

<div id="windows" data-role="popup" style="margin-left:54px;margin-top:145px">

注意:!!

技术分享

自动增强类型的按钮,可否禁用?

添加data-role="none"的属性即可

技术分享

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。