被CSS，報告查看器和Div計算擋住了

我被這個問題困住了幾天。基本上我想要做的是將一個頁眉圖像添加到一個顯示ms瀏覽器的asp頁面，該瀏覽器可以通過Web瀏覽器進行調整。報告查看器應該佔用網頁的其餘部分減去標題圖像。單獨的報告查看器的代碼可以很好地工作。問題出現在我添加標題圖像時。由於它是一個固定的高度，它會拋出整個頁面，並且不能滿足垂直和水平滾動條顯示與ms report manager類似的要求。我已經嘗試了很多技術，包括試圖通過CSS來實現，改變DIV的百分比，如果你看我的代碼，我開始使用一些Javascript，但不知道還有哪些地方可以使用它。有一次，我以爲我發現在報表查看器上面添加一行並將圖像放在那裏成功。問題是當Web瀏覽器的寬度開始崩潰時，報表查看器的行爲被修改，因爲圖像不允許報表查看器崩潰。目前我正在嘗試一個I幀，似乎有一些承諾。無論如何，如果任何人可以給我任何想法，想法，解決方案，明智的裂縫。我當然會很感激。這是我的代碼。今天有一段時間，我坐在書桌前，真的不知道該去哪裏。我的網絡知識有限。感謝 - P狗被CSS，報告查看器和Div計算擋住了

<html> 
<head id="Head1" runat="server"> 
    <title></title> 
    <script type="text/javascript"> 
     window.onload = getH; 


     window.onresize = getH; 

     function getH() { 
      var browserH = document.documentElement.offsetHeight; 
      var divHeaderH = document.getElementById("header").offsetHeight; 
      var divContentH = document.getElementById("content").offsetHeight; 
      var rptViewerH = document.getElementById("ReportViewer").offsetHeight; 

//   var target = document.getElementById('content'); 
//   target.style.height = (winH + 100) + "px"; 

//   var contentH = winH - divh; 
//   
//   alert(divh); 
//   alert (winH); 
//   alert(content); 

    // } 
</script> 
<style > 
    body 
    { 
    overflow: hidden; 
    } 
</style> 



</head> 
<body> 
    <form id="frmBody" runat="server" style="height:100%; "> 

     <%--<div id= "header" style=" width: 100%; height:98px; background-color: brown" > 
      <center> 
         <asp:Image ID="imgStateLogo" runat="server" ImageUrl="~/App_Themes/Images/nclogo.jpg" /> 
      </center> 
     </div>--%> 

     <div id ="content" style="height: 100%; width:100%;"> 
      <table id="rptViewer" runat=server align=center width="100%" height="100%"> 
       <tr> 
        <td> 
         <asp:Label ID="lblTitle" runat="server" style="font-weight:bold" EnableViewState="True"></asp:Label> 
         <asp:ScriptManager ID="scrptRPTViewer" runat="server" AsyncPostBackTimeout="0" ></asp:ScriptManager> 
         <rsweb:ReportViewer ID="ReportViewer" runat="server" Font-Names="Verdana" Font-Size="8pt" Height="99%" ProcessingMode="Remote" 
          Width="100%" ShowCredentialPrompts="true" AsyncRendering="False"> 
         </rsweb:ReportViewer> 
        </td> 
       </tr> 
      </table> 
     </div> 

    </form> 
</body> 

</html>

來源

2011-09-01 pdog

身高：100％是這裏的問題 - 它看起來在父，這是佔據了整個機身標籤形式的高度，並設置等於一個高度。

如果您不願意使用框架，您可以使用JavaScript將content div的大小設置爲等於browserHeight - headerHeight，然後將事件偵聽器添加到窗口的大小事件以重新計算並重新應用每當瀏覽器窗口更改尺寸時，content div的高度。

來源

2011-09-01 00:55:23

感謝您的回覆。所以你告訴我的是，形式上的高度設置爲100％就是問題所在？至於框架，我創建了一個名爲container.aspx的頁面。在該頁面中，我添加了一個標題圖像並添加了一個調用上面頁面的iframe。因爲這個原因，我只想找到正確的方法，我有很多問題。你能評論一下我評論過的javascript嗎？再次感謝 – pdog

不，div＃內容上設置的高度是問題所在。在這種情況下，100％意味着「與父容器相同的高度」，而不是「父容器中的剩餘空間」。 iframe方法遇到與div方法相同的問題。有許多CSS教程可用於窗口高度內容的代碼示例。 [這是一個可以做你需要的東西]（http://www.456bereastreet.com/lab/cssframes/）。 –

謝謝S先生 - 我正在研究它。 – pdog

而不是將您的圖像放在與報告相同的表中，請將#header放在#content的報告表上。

來源

2011-09-01 01:20:11 Artyom

如果我誤解了，我很抱歉，但將#header添加到#content div？感謝您的幫助 – pdog

@pdog是的，只需在表格上方的'＃content' div中移動'＃header' div即可。這樣，由於圖像不在表格內，因此不會在表格上施加寬度，報表查看器將能夠摺疊。我認爲這應該解決您的問題，而不必使用JavaScript。 – Artyom

被CSS，報告查看器和Div計算擋住了

回答

相關問題