如何根據asp.net中的屏幕大小加載唯一的css文件？

-1

我在網站上了深刻的樣子ebay, facebook,amazon, etc並找出當用戶去他們的網站，他們檢測到顯示器屏幕分辨率/大小，並將其存儲在cookie中，並加載基於屏幕分辨率的CSS文件。如何根據asp.net中的屏幕大小加載唯一的css文件？

如何實現在asp.net這種情況。根據分辨率變化，我有一個響應式佈局和using media queries。

但現在我想解決用戶首先發現其屏幕分辨率只加載基於該結果對CSS文件。

任何建議！

<link rel="stylesheet" type="text/css" href="main.css" /> 
<link id="size-stylesheet" rel="stylesheet" type="text/css" href="mobile.css" />

來源

2014-09-20 Hassaan Khan

你看對谷歌？我發現的例子太多了，這裏是一個http://stackoverflow.com/questions/23071521/how-to-load-different-css-file-depending-on-window-width-smaller-size-not-recog – Aristos 2014-09-20 08:45:21

嘗試首先了解這個問題！我想你不讀我的問題，我沒有要求加載基於媒體的CSS。爲簡單起見，轉到Facebook並在Cookie中檢查您找到的屏幕尺寸。然後增加或減少瀏覽器的寬度高度，它不會加載響應的CSS。但如果你從手機登錄，它會顯示手機的CSS。我想要實現這一點。 – 2014-09-20 09:21:43

請注意，我不會downvote這個問題（兩者都沒有投票）。現在，只有使用javascript才能實時獲取瀏覽器的大小，然後將此大小發送到代碼後面並使用它。其他方式是閱讀瀏覽器簽名，其他方式是自己的CSS。 – Aristos 2014-09-20 09:29:14

您可以使用流動代碼。

你必須把這個JavaScript到<head>標籤。

$(function() 
    { 
    var ScrnHeight = $(window).height(); 
    var ScrnWidth = $(window).width(); 

    if (ScrnWidth <= 360) { // for mobile view 
     $("<link/>", { 
      rel: "stylesheet", 
      type: "text/css", 
      href: "/styles/mobile.css" 
     }).appendTo("head"); 
    } 
    else { // for desktop view 
     $("<link/>", { 
      rel: "stylesheet", 
      type: "text/css", 
      href: "/styles/main.css" 
     }).appendTo("head"); 
    } 
});

來源

2014-09-20 08:45:32 prog1011

@Hassaan汗 - 如果答案是有用的，請單擊「正確」或「給予好評」，因此它會幫助其他找出正確的解決方案。 – prog1011 2014-09-20 08:50:11

對不起，我沒有要求 – 2014-09-20 09:29:54

如何根據asp.net中的屏幕大小加載唯一的css文件？

回答

相關問題