niunan222
niunan222
  • 发布:2016-08-07 15:43
  • 更新:2016-08-08 11:36
  • 阅读:1199

用openWindow可以打开子页保留头尾吗?

分类:MUI
mui

想在移动端上进行浏览,不能用plus.webview.show,
主页index做了个head和底部Tab了,想点击底部Tab后只是在中间打开显示的,请问可以做到吗?

<!DOCTYPE html>  
<html>  
<head>  
    <meta charset="utf-8">  
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />  
    <title></title>  
    <script src="js/mui.min.js"></script>  
    <link href="css/mui.min.css" rel="stylesheet"/>  
    <script type="text/javascript" charset="utf-8">  
        mui.init({  
            subpages:[{  
              url:'home.html',  
              id:'home.html',  
              styles:{  
                top:'45px',//mui标题栏默认高度为45px;  
                bottom:'50px'//默认为0px,可不定义;  
              }  
            }]  
          });  
    </script>  
</head>  
<body>  
    <header class="mui-bar mui-bar-nav">  
        <h1 class="mui-title">外卖APP</h1>  
    </header>  

    <nav class="mui-bar mui-bar-tab">  
        <a class="mui-tab-item mui-active" href="index.html">  
            <span class="mui-icon mui-icon-home"></span>  
            <span class="mui-tab-label">首页</span>  
        </a>  
        <a class="mui-tab-item" href="xiadan.html">  
            <span class="mui-icon mui-icon-download"></span>  
            <span class="mui-tab-label">下单</span>  
        </a>  
        <a class="mui-tab-item" href="gwc.html">  
            <span class="mui-icon mui-icon-compose"></span>  
            <span class="mui-tab-label">购物车</span>  
        </a>  
        <a class="mui-tab-item" href="news.html">  
            <span class="mui-icon mui-icon-bars"></span>  
            <span class="mui-tab-label">新闻</span>  
        </a>  
        <a class="mui-tab-item" href="my.html">  
            <span class="mui-icon mui-icon-person"></span>  
            <span class="mui-tab-label">我的</span>  
        </a>  
    </nav>  
    <script>  
        mui('.mui-bar-tab').on("tap","a",function(){   
            var href = this.getAttribute('href');  
            mui.openWindow({  
                url:href,  
                id:href,  
                styles: {  
                    top:'44px',  
                    bottom:'50px'  
                }  
            });  
        })  
    </script>  
</body>  
</html>

如上代码所示。。我打开了是覆盖整个页面的,没有保留到头尾。。我不想每个页面都建立相同的头尾。。。

2016-08-07 15:43 负责人:无 分享
已邀请:
赵梦欢

赵梦欢 - 专注前端,乐于分享!

预览效果:
https://rawgit.com/zhaomenghuan/mui-demo/master/example/tabbar-with-iframe/tab-webview-main.html

代码下载:
https://github.com/zhaomenghuan/mui-demo/tree/master/example/tabbar-with-iframe

  • niunan222 (作者)

    原来如此,多谢!!!

    2016-09-12 15:15

该问题目前已经被锁定, 无法添加新回复