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

发布于 2024-11-14 06:24:09 字数 958 浏览 2 评论 0原文

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

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

我想避免这种情况。我读过我们可以使用 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>

原文

I have a page which is attached to a masterpage. In this page i have update panel and in it have i have a asp.net panel.

This panel has gridview which shows data from database. Currently I have fixed width and height of the panel. So if user screen resolution is bigger than that specified width and height, then it leaves blank spaces.

I want to avoid this. I have read that we can use javascript to get screen resolution of user screen. I tried this in a page which is not attached to any masterpage and called that javascript function in the body of that page and it worked fine. But i dont know how to do this in a page attached to a masterpage. The code that used is:

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

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

冷清清 2024-11-21 06:24:09

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

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

回复收藏 0 原文

~没有更多了~