如何交換樣式表的鏈接

我正在開發使用PHP，XHTML嚴格，和jQuery一個網站，將能夠靈活地支持移動設備和桌面設備，使用最小的設備寬度使用Responsive Web Design方法和服務不同的樣式表屬性。如何交換樣式表的鏈接

<link rel="stylesheet" href="css/960.css" type="text/css" media="screen and (min-device-width: 480px)" />

但該網站需要有一個鏈接來切換「桌面」和「moblie」視圖。我有一個關於如何使用jQuery完成這項工作的基本想法，但對於不支持JavaScript的設備，更願意使用php的解決方案。

來源

2011-03-04 Mike Eng

PHP是不是太難用，以實現這一點。如果你使用一個鏈接，像這樣......

<a href="?view=desktop">Desktop view</a>

在你的網頁腳本

則...

//test for stylesheet parameter 
if(isset($_GET['view'])) 
{ 
    //save and set it in the session 
    $stylesheet = $_GET['view']; 
    $_SESSION['stylesheet'] = $stylesheet; 
} 
elseif(isset($_SESSION['stylesheet'])) 
{ 
    //parameter not sent, so get it from the session 
    $stylesheet = $_SESSION['stylesheet']; 
}

後來，你在此基礎上$stylesheet變量選擇的樣式表的代碼。

if($stylesheet == 'desktop') 
{ 
    echo '<link rel="stylesheet" href="/css/desktop.css" type="text/css" />'; 
} 
elseif($stylesheet == 'mobile') 
{ 
    echo '<link rel="stylesheet" href="/css/mobile.css" type="text/css" />'; 
} 
else 
{ 
    echo'<link rel="stylesheet" href="css/960.css" type="text/css" media="screen and (min-device-width: 480px)" />'; 
}

來源

2011-03-04 16:23:23

的其他人顯然是利用媒體查詢當前的鏈接棧。 –

這個工作除了在if語句中缺少「）」字符之外。但我解決了這個問題，這很好。 –

很好的捕捉失蹤的「）」，我吮吸計數。 :) –

那麼，爲什麼不包括根據查詢參數的適當的樣式表，或會話變量或UA等等等等

//Code that figures out what type is 
$css = ''; 
switch ($type) { 
    case 'mobile': 
     $css = '<link rel="stylesheet" href="css/960.css" type="text/css" />'; 
     break; 

    case 'touch': 
     $css = '<link rel="stylesheet" href="css/960-mobile.css" type="text/css" />'; 
     break; 

    case 'desktop': 
    default: 
     $css = '<link rel="stylesheet" href="css/960-full.css" type="text/css" />'; 
     break; 
}

在你看來

echo $css;

注意這僅僅是一個例。理想情況下，你不應該在PHP中構建你的整個鏈接html，但不知道你的任何實現細節，這就足夠了。這樣做是命名您的CSS文件中，只有一個-type以標準的方式在最後區分在使用的每個文件，只是在$type變量傳遞給視圖的最佳方式。

這是你在找什麼？

來源

2011-03-04 16:19:58 JohnP

爲什麼你會在你的鏈路交換機中包含媒體查詢？這隻會導致「強制」鏈接被忽略。你認爲他還包括用戶代理嗅探（blech）。 –

@Kevin，完全同意有關媒體查詢，錯過了：S編輯 – JohnP

您可以爲此使用SESSION變量。下面的示例假定有兩個樣式mobile.css和desktop.css

測試參數，並建立會話。

<?php 
session_start(); 
    if(isset($_GET['style']))//Tests the argument 
    { 
    if($_GET['style']=="desktop")//This to prevent passing wrong arguments 
    { 
     $_SESSION['style']=$_GET['style']; 
    } 
    if($_GET['style']=="mobile")//This to prevent passing wrong arguments 
    { 
     $_SESSION['style']=$_GET['style']; 
    } 
    } 

    ?> 

<head> 
blah 
<?php 
if(isset($_SESSION['style']) 
{ 
echo '<link rel="stylesheet" href="'.$_SESSION['style'].'.css" type="text/css" media="all" />'; 
} 
?> 
</head>

您的從/切換到桌面CSS的鏈接。

<a href="?style=desktop">Desktop version</a> 
<a href="?style=mobile">Mobile version</a>

來源

2011-03-04 16:25:03

如何交換樣式表的鏈接

回答

相關問題