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,
});
}
});