Ошеломлен CSS, просмотра отчетов и расчетов Div - PullRequest
1 голос
/ 01 сентября 2011

Я был озадачен этой проблемой пару дней.В основном то, что я пытаюсь сделать, это добавить изображение заголовка на страницу asp, которая отображает средство просмотра отчетов ms, которое можно просматривать в веб-браузере.Средство просмотра отчетов должно занимать оставшуюся часть веб-страницы без изображения заголовка.Код только для просмотра отчетов работает прекрасно.Проблема возникает, когда я добавляю изображение заголовка.Поскольку она имеет фиксированную высоту, она отбрасывает всю страницу, а требования к вертикальной и горизонтальной полосам прокрутки, аналогичным диспетчера отчетов MS, не выполняются.Я перепробовал много техник, включая попытки сделать это с помощью CSS, изменение процентного содержания в DIV, и если вы посмотрите на мой код, я начал с некоторого Javascript, но не знал, куда еще пойти с ним.В какой-то момент я подумал, что добился успеха, добавив строку над средством просмотра отчетов и поместив туда изображение.Проблема заключалась в том, что, когда ширина веб-браузера начала сокращаться, существует точка, в которой поведение средства просмотра отчетов изменяется, поскольку изображение больше не позволяет средству просмотра отчета больше сворачиваться.В настоящее время я пробую I Frame, и, кажется, есть какое-то обещание.Во всяком случае, если кто-то может отправить мне какие-либо идеи, мысли, решения, мудрые трещины.Я, безусловно, был бы признателен за это.Вот мой кодОднажды сегодня я сидел за своим столом и действительно не знал, куда идти.У меня ограниченные веб-знания.Спасибо - P собака

<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>

Ответы [ 2 ]

1 голос
/ 01 сентября 2011

Высота: здесь проблема в 100% - она ​​смотрит на высоту родителя, которая является формой, которая занимает весь тег body, и устанавливает высоту, равную этому.

Если вы не хотите использовать фреймы, вы можете использовать JavaScript, чтобы установить размер содержимого div равным browserHeight - headerHeight, а затем добавить прослушиватель событий в событие размера окна, чтобы пересчитать и повторно применить контент Высота div каждый раз, когда окно браузера меняет размеры.

0 голосов
/ 01 сентября 2011

Вместо того, чтобы поместить изображение в ту же таблицу, что и отчет, поместите #header над таблицей отчетов в #content.

...