2013-11-26 42 views
0

我正在開發一個WordPress的響應網站。但現在我面臨問題菜單問題。請參閱下圖的導航。在上面的黑條「檢查我們的城」將有下拉菜單和藍條關於我們也有下拉菜單如何觸發屏幕分辨率的HTML/PHP文件庫

enter image description here

,所以我希望在屏幕分辨率波紋管800則頂部菜單和標誌部分會有所不同。我知道一種方法,就像我可以製作單獨的標題部分,然後通過CSS隱藏並通過CSS媒體查詢調用它。爲此我需要始終保持代碼的正文。但我不想要它,我希望它的代碼將在體內只有當它需要。

說如果讓頂部區域分開的HTML/PHP文件,如果我可以打電話時屏幕分辨率將800/480等,這將是我的工作。我可以通過php/js,但我不知道如何。

看到圖像有兩個部分用於導航一個是黑色區域,另一個是藍色區域。當我將低音800px它將在一個下拉菜單。

參見下文菜單,我想這種類型時,屏幕分辨率波紋管800像素

enter image description here

+0

如何引導? http://getbootstrap.com/ http://stackoverflow.com/questions/4180134/how-to-get-users-screen-resolution-with-php http://stackoverflow.com/questions/1504459/getting -the-screen-resolution-using-php –

+0

@TrinhHoangNhu So Bootstrap現在是新的jQuery嗎? OP:嘗試使用現有元素。你可以用CSS縮小你的標誌嗎?你可以使用精靈嗎? – Gant

+0

@TrinhHoangNhu謝謝..我不是在引導啓動,但我認爲引導不能包括兩個導航到一個下降道恩我認爲我想要的方式,因爲我需要單獨..但我不知道..主意歡迎 –

回答

0

我認爲,實現這一目標是使用AJAX的唯一途徑。發送一個空白頁面到客戶端,檢查窗口大小,並通過ajax以屏幕寬度作爲參數請求內容。

+0

我通過ajax調用沒有問題,但我不知道如何做到這一點。 –

1

我不會推薦使用ajax來加載2個導航。它增加了一個額外的http請求,這比僅僅爲桌面和移動設備提供一點點額外的標記要慢。

我認爲使用媒體查詢是最好的方法。

這就是我想你想TODO: http://jsfiddle.net/krismeister/CNr5y/

的relevevant部分是 @media screen and (min-width:800px){

+0

謝謝。是的,如果我不能做任何其他方式,然後媒體查詢我會使用..但個人我不添加額外的身體上的代碼。 –

+0

繼承人沒有額外的標記: http://jsfiddle.net/krismeister/CNr5y/1/ 它使用導航:之前添加任何移動內容。 – LessQuesar

+0

謝謝少了...它也是個好主意 –

0

我不是jQuery和JSON ..你吼叫這麼好辦法可以工作?

$(function() { 
    $.post('some_script.php', { width: 800px }, function(json) { 
     if(json.outcome == 'success') { 
      header-800px.php; 
     } else { 
      header.php; 
     } 
    },'json'); 
}); 

裁判:Getting the screen resolution using PHP