如何根据用户屏幕的分辨率设置面板的宽度和高度?

时间:2011-06-07 10:50:32

标签: javascript asp.net master-pages screen-resolution

我有一个附加到母版页的页面。在这个页面中我有更新面板,其中有一个asp.net面板。

此面板具有gridview,显示数据库中的数据。目前我已经固定了面板的宽度和高度。因此,如果用户屏幕分辨率大于指定的宽度和高度,则会留下空格。

我想避免这种情况。我已经读过我们可以使用javascript来获取用户屏幕的屏幕分辨率。我在一个没有附加到任何母版页的页面中尝试了这个,并在该页面的主体中调用了javascript函数,它工作正常。但我不知道如何在附加到母版页的页面中执行此操作。使用的代码是:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>

    <script language="javascript" type="text/javascript">
    function getWidth(width)
    {
        document.getElementById('Panel1').style.width = width+'px';
    }
</script>
</head>
<body onload="javascript:getWidth(screen.width)">
    <form id="form1" runat="server">
    <div>
        <asp:Panel ID="Panel1" runat="server" BorderStyle="Dotted" Height="50px" Width="125px" ScrollBars="Horizontal">
            </asp:Panel>

    </div>
    </form>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

<script language="javascript" type="text/javascript">

    var prm = Sys.WebForms.PageRequestManager.getInstance();

    function BeginRequestHandler(sender, args) {
    }

    function EndRequestHandler(sender, args) {
       getWidth(screen.width)
    }

    prm.add_beginRequest(BeginRequestHandler);
    prm.add_endRequest(EndRequestHandler);

    function getWidth(width)
    {

        $get('<%=Panel1.ClientID%>').style.width  = width+'px';

    }

</script>