Phonegap css height%在android 4.2 - 4.3中无效

时间:2016-05-17 05:04:33

标签: javascript android html css cordova

我总是使用Android 5.0手机和Android 4.4手机来测试我的应用程序。他们总是工作。昨天,我发现了一款​​Android 4.3手机并用它来测试我的应用程序。它们不能正常工作 - 高度(%)。然后我在Android 4.2手机中做同样的事情,看看它是否可行。但它是一样的。我该怎么做才能解决它?

1 个答案:

答案 0 :(得分:0)

我也遇到了这个问题,在页面实际显示在屏幕上之前,页面大小及其内容都不知道。

所以我做的是使用触发器自定义事件(使用jquery):http://api.jquery.com/trigger/

我在JS中使用自定义事件绑定规则(使用屏幕的标准大小):

$('body').on('custom_event:elements_loaded',{'fsContainer':fsContainer,'elementToCenter':elementToCenter,'zoneToCenterElementIn':zoneToCenterElementIn},function(event){

            fsContainerHeight = ViewManagementTools.getValueFromPixelSizeString($('#'+event.data.fsContainer).css('height'));
            elementToCenterHeight = ViewManagementTools.getValueFromPixelSizeString($('#'+event.data.elementToCenter).css('line-height'));

            ztceiChild = $('body').find('[id='+event.data.zoneToCenterElementIn +'] div');
            zoneToCenterElementInHeight = ViewManagementTools.getValueFromPixelSizeString($(ztceiChild).css('height'));

            marginToApply = (zoneToCenterElementInHeight - elementToCenterHeight)/2;
            $('#'+event.data.zoneToCenterElementIn).parent().css('height',zoneToCenterElementInHeight+'px');
            $('#'+event.data.elementToCenter).css('margin-top',marginToApply+'px');
            $('#'+event.data.elementToCenter).css('height',elementToCenterHeight);
            if(fsContainerHeight<=elementToCenterHeight){
                $('#'+event.data.fsContainer).css('height',elementToCenterHeight + 2*marginToApply);
            } else {
                marginToApply = (fsContainerHeight - elementToCenterHeight)/2;
                $('#'+event.data.elementToCenter).css('margin-top',marginToApply+'px');

            }
        });

然后当页面显示,或者甚至在设备上,如果你使用屏幕的标准尺寸来布局东西,你可以触发事件:

        $('body').trigger('custom_event:elements_loaded');