• apiCloud中Frame框的操作,显示与隐藏Frame


    Frame是一层一层的概念,

    有的位于上层,有的位于下层。

    1.加载菜单

    2.加载页面层

    3.首页拆分出内容层,这个时候内容层位于页面层的上方,当点击其他页面的时候,内容层遮挡住了他们

    解决方案一

    判断是否是首页,如果不是首页,则将内容层调整到页面层后方。

    如果是首页,则将内容层调整到前方。

    这种方案有个弊端,就是其它层下拉的时候,还能够看到内容层的残留。

    解决方案二

    通过设置Frame属性,将Frame进行隐藏和显示操作。这就完美了。

    具体代码如下,

    	 var eFooterLis = $api.domAll('#footer .aui-bar-tab-item'),
                frames = []; // 选择所有匹配的DOM元素
            for (var i = 0,len = eFooterLis.length; i < len; i++) {
                    // 判断是否登录
                    var username = $api.getStorage('customer_id');
                    var url = './html/frame'+i+'.html';
                    if (i==4 && !username) {
                        url = './html/userLogin.html';
                    }
                    frames.push( { 
                        name: 'frame'+i, 
                        url: url,
                        bgColor : 'rgba(0,0,0,.2)',
                        bounces:true,
                        pageParam:{
                            'footer_height':$api.dom('footer').offsetHeight
                        },
                    } )
            }
    
            api.openFrameGroup({ // 打开 frame 组
                name: 'group',
                scrollEnabled: false,
                rect: {
                    x: 0,
                    y: 0,
                    w: api.winWidth,
                    h: api.winHeight-$api.dom('footer').offsetHeight
                },
                index: 0, // 默认是首页
                frames: frames
            }, function (ret, err) {
                if (ret.index != '0') { // 不是首页
    //                api.sendFrameToBack({ // 调整到后方
    //                    from: 'frame0Con',
    //                    to: ret.frameName
    //                });
    
                    api.setFrameAttr({ // 隐藏内容层
                        name: 'frame0Con',
                        hidden:true,
                    });
                } else { // 是首页
    //                api.bringFrameToFront({ // 调整到前方
    //                    from: 'frame0Con',
    //                    to: ret.frameName
    //                });
    
                    api.setFrameAttr({ // 显示内容层
                        name: 'frame0Con',
                        hidden:false,
                    });
                }
            });
    

  • 相关阅读:
    Chrome 控制台console的用法[转]
    Page Visibility(页面可见性) API介绍、微拓展[转]
    移动端rem单位用法[转]
    JavaScript继承方式详解[转]
    说说React
    Flex 布局教程:语法篇[转]
    git 常用命令总结
    Supervisor 在ubuntu系统下添加自启动
    Django 通过APNS推送消息
    通过 python-xmp-toolkit 读取图片xmlp信息
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/5970419.html
Copyright © 2020-2023  润新知