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


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM