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.
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开发者_Go百科="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>
加载中,请稍侯......
精彩评论