2012-12-26 61 views
0

我想在WebView多個HTML文件,以顯示調整大小的I幀在一個HTML中使用的I幀內部的WebView

我使用的HTML文件下面的腳本,以調整I幀的高度在當前HTML。

<body onload="resizeFrames()" link="#bb7722" vlink="#bb7722" alink="#bb7722" > 


    <script type="text/javascript"> 
     // Firefox worked fine. Internet Explorer shows scrollbar because of frameborder 
     function resizeFrames() { 
      var all_IFrames = document.getElementsByTagName('iframe'); 
      i = 0; 
      while (frame = all_IFrames.item(i++)) { 
       resizeFrame(frame); 
      }    
     } 
     function resizeFrame(f) { 

      f.style.height = f.contentWindow.document.body.scrollHeight + "px"; 
     } 
    </script> 

    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="b.html"></iframe> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="c.html"></iframe> 

爲了在JavaScript來的工作我用的是foloowing代碼:

WebSettings webSettings = wb.getSettings(); 
webSettings.setJavaScriptEnabled(true); 

我加載HTML文件是這樣的:

webView.loadUrl("file:///android_asset/a.html"); 

的問題是,調整大小的尺寸iframe有時太大而且太小。

我與Android 2.2測試了GALAXY S和所有的幀都較小(在端切斷)並與機器人4.0.4其它設備,所有的幀都更大(添加空的空間)

如果我刪除webSettings.setJavaScriptEnabled(true);在GALAXY S消失的問題,但在第二個設備,幀完全不

完全的HTML代碼調整:

<!DOCTYPE html> 
<html> 
<head> 
    <style> 


    body{ 
    color: #aa6611; 
    font-size:20px; 
    } 

    .link { 
    font-weight: bold; 
    color: #bb7722; 
    } 
    </style> 


</head> 

<body onload="resizeFrames()" link="#bb7722" vlink="#bb7722" alink="#bb7722" > 


    <script type="text/javascript"> 
     // Firefox worked fine. Internet Explorer shows scrollbar because of frameborder 
     function resizeFrames() { 
      var all_IFrames = document.getElementsByTagName('iframe'); 
      i = 0; 
      while (frame = all_IFrames.item(i++)) { 
       resizeFrame(frame); 
      }   
     } 
     function resizeFrame(f) { 
      f.style.height = f.contentWindow.document.body.scrollHeight + "px"; 
     } 
    </script> 

    <a name="top"></a> 


    <font size = "6" color="#ffaa55">Guide</font> 
    <br /> 
    <br /> 

    <a href="#mainscreen" class="link" >Main screen</a> <br /> 
    <a href="#inventory" class="link">Inventory</a> <br /> 
    <a href="#store" class="link">Store</a> <br /> 
    <a href="#market" class="link">Market</a> <br /> 
    <a href="#creatureattackdialog" class="link">Creature Attack Dialog</a> <br /> 
    <a href="#userattackdialog" class="link">User Attack Dialog</a> <br /> 
    <a href="#miniattackdialog" class="link">Mini Attack Dialog</a> <br /> 
    <a href="#profile" class="link">Profile</a> <br /> 
    <a href="#creatureinfo" class="link">Creature info</a> <br /> 
    <a href="#userinfo" class="link">User info</a> <br /> 
    <a href="#iteminfo" class="link">Item info</a> <br /> 
    <a href="#lastattackers" class="link">Last Attackers</a> <br /> 
    <a href="#achievementshistory" class="link">Achievements History</a> <br /> 
    <a href="#achievementsDialog" class="link">Achievement info</a> <br /> 
    <a href="#options" class="link">Options</a> <br /> 


    <br /> 

    <p> 
    <a name="mainscreen"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="mainscreen.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="inventory"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="inventory.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="store"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="store.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="market"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="market.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="creatureattackdialog"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="attackDialogCreature.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="userattackdialog"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="attackDialogUser.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="miniattackdialog"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="miniattackdialog.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="profile"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="profile.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="creatureinfo"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="creatureInfo.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="userinfo"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="userInfo.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="iteminfo"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="itemInfo.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="lastattackers"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="lastattackers.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="achievementshistory"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="acheivementhistory.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="achievementsDialog"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="acheivementDialog.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 

    <p> 
    <a name="options"></a> 
    <iframe width="100%" scrolling="no" frameborder=0 border=0 src="optionsDialog.html"></iframe> 
    </p> 
    <a href="#top" class="link">Back</a> <br /> 



</body> 
</html> 

回答

0

您需要爲onload事件處理組偵聽在iframe標籤中,每個和resiz當iframe不是主體被加載時,每一個。

var iframe = document.getElementById('yourIF'); 
var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow; 
iframe.style.height = (iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight) + "px"; 
+0

其不工作 – piojo

+0

根本不工作或做錯了嗎? – HMarioD

+0

它做錯了 – piojo