通過客戶端屏幕尺寸調整網格大小

Question

我想通過客戶端屏幕大小在頁面加載時設置datagrid的大小。 有什么辦法可以在頁面加載或服務器端的其他頁面事件時獲得此大小？

我使用Request.Browser.ScreenPixelsWidth和Request.Browser.ScreenPixelsHeight但是這些大小不正確。 這些尺寸始終為640 * 480。

Answer 1

Request.Browser.ScreenPixelsWidth和Request.Browser.ScreenPixelsHeight無法提供服務器端的客戶端屏幕分辨率。

最好的方法是使用javascript-

<%if (!this.IsPostBack)
{%>
<script language="javascript" type="text/javascript">
var rowURL = window.location.href;
var screenWidth = window.screen.availWidth;
if (rowURL.indexOf("screen_width") == -1)
window.location.href = window.location.href + "?screen_width=" + screenWidth;
</script>
<%}%>

在頁面的“ body”標簽中使用此腳本。 它只是將'screen_width'參數附加到查詢字符串並刷新頁面。 這樣，您可以從查詢字符串獲取服務器端“ screen_width”的值。

Answer 2

您可以使用Javascript獲取視口的寬度和高度。 然后通過隱藏的表單輸入或ajax將值傳遞回去。

var width = $(window).width();
var height = $(window).height();

首先，添加這些隱藏的表單輸入以存儲寬度和高度，直到回發為止。

<asp:HiddenField ID="width" runat="server" />
<asp:HiddenField ID="height" runat="server" />

接下來，我們要獲取窗口（視口）的寬度和高度。 jQuery為此有兩種方法，恰當地命名為width（）和height（）。

將以下代碼添加到head元素內的.aspx文件中。

<script type="text/javascript">
$(document).ready(function() {

    $("#width").val() = $(window).width();
    $("#height").val() = $(window).height();    

});
</script>

這將導致回發時可以使用瀏覽器窗口的寬度和高度。 只需訪問隱藏的表單輸入，如下所示：

var TheBrowserWidth = width.Value;
var TheBrowserHeight = height.Value;

希望對您有所幫助。