秦安
秦安
  • 发布:2016-12-24 10:00
  • 更新:2016-12-24 10:15
  • 阅读:2025

如何解决调用plus.navigator.之后iPhone的nav顶到了状态栏里面?

分类:HTML5+

调用这两句之后iphone状态栏颜色改了没错,不过怎么nav顶到状态栏里面了?请问怎么解决?

        plus.navigator.setStatusBarBackground("#6666cc");  
        plus.navigator.setStatusBarStyle( "UIStatusBarStyleBlackOpaque" );
2016-12-24 10:00 负责人:无 分享
已邀请:
mubrand

mubrand - mubrand.com 承接各类app开发,java语言,含界面设计及前端

高度需要单独调整的

<script type="text/javascript" charset="utf-8">  
            mui.init();  
            mui.plusReady(function() {  
                var topoffset = '45px';  
                // 兼容immersed状态栏模式  
                if(plus.navigator.isImmersedStatusbar()){  
                    var immersed = 0;  
                    var ms = (/Html5Plus\/.+\s\(.*(Immersed\/(\d+\.?\d*).*)\)/gi).exec(navigator.userAgent);  
                    // 当前环境为沉浸式状态栏模式  
                    if(ms&&ms.length>=3){  
                        immersed = parseFloat(ms[2]);// 获取状态栏的高度  
                    }  
                    topoffset = (immersed + 45)+'px';  
                    /*调整高度*/  
                    document.querySelector(".mui-bar-nav").style.paddingTop = immersed+'px';  
                    document.querySelector(".mui-bar-nav").style.height = topoffset;   
                    document.querySelector(".mui-bar-header-secondary").style.top = topoffset;   
                    //document.querySelector(".mui-content").style.marginTop = topoffset;   
                }  
            });  
</script>
  • 秦安 (作者)

    我试试哈,谢谢!

    2016-12-24 10:36

  • 秦安 (作者)

    哈哈,可以了,谢谢啊!

    2016-12-24 10:48

  • 秦安 (作者)

    你好,你代码里面的 document.querySelector(".mui-content").style.marginTop = topoffset; 我用上了,但是发现class为mui-content的div并没有下移,被下移成功的nav盖住了,这个怎么解决?

    2016-12-24 13:16

  • mubrand

    这个不一定是通用的,根据你现在的页面结构,简单的页面可以用,页面包含下拉上啦刷新的或者有二级头部的,可能还需要调整。你说的这个问题改成style.paddingTop试试?.mui-content这个好像是padding来调整的,我也忘了:)

    2016-12-26 11:13

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