简体   繁体   English

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

[英]How to set width and height of a panel according to the resolution of the user screen?

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.在此页面中,我有更新面板,其中有一个 asp.net 面板。

This panel has gridview which shows data from database.这个面板有 gridview 显示来自数据库的数据。 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.我读过我们可以使用 javascript 来获取用户屏幕的屏幕分辨率。 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.我在未附加到任何母版页的页面中尝试了此操作,并在该页面的正文中调用了 javascript function,它运行良好。 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>
<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>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何使用javascript根据屏幕分辨率设置主体宽度? - how to set the body width according to screen resolution using javascript? 打开不带地址栏和标题的javascript弹出窗口,标题和高度和宽度根据屏幕分辨率按百分比设置 - Opening javascript popup window without address bar and title with height and width set in percentage according to screen resolution 如何根据屏幕分辨率设置页面宽度并在调整浏览器大小时水平滚动页面的其余部分? - how to set the width of the page according to the screen resolution and scroll the rest of the page horizontally when the browser is resized? 如何根据svg的宽度动态设置svg的信息面板宽度? - How to set the width of info panel for the svg according to the width of svg dynamically? 滑块的高度取决于屏幕的宽度 - Height of the slider according to the width of the screen 如何在JavaScript中按%(百分比)设置屏幕高度和宽度 - How to set the screen height and width by %(percentage) in javascript 根据屏幕设置幻灯片显示宽度 - Set slideshow width according to the screen 制表符根据屏幕分辨率设置列布局 - tabulator set column layout according screen resolution 如何从iframe中删除滚动并根据内容设置高度和宽度 - How to remove scroll from the iframe and set the height & width according to content jQuery - 根据屏幕宽度添加像素到高度 - jQuery - add pixels to height according to screen width
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM