我該如何改變我的Jquery幻燈片，以改變不同屏幕分辨率的尺寸

我目前使用2個CSS樣式表，附帶媒體查詢附加到我的網站，以便它可以調整不同的瀏覽器尺寸。我的問題是，我有一個Jquery動畫幻燈片，我需要圖像更改爲更小的尺寸時，以更小的分辨率查看網站。我有一個div中包含的幻燈片，其中包含一個jquery動畫，它擴展了盒子的設置寬度，給出了幻燈片顯示內部需要改變以及進行補償的錯覺。我該如何改變我的Jquery幻燈片，以改變不同屏幕分辨率的尺寸

這裏是我的默認jQuery的具有用於股利動畫擴大

$(document).ready(function() { 
$("#slideshow_box") 
    .animate({"height": "600px"}, 500) 
    .animate({"width": "488px"}, 500); 
});

我將如何改變這種狀況，使較小的觀賞版本會是這樣，但只會觸發關閉時正在瀏覽的站點在較小的分辨率？

$(document).ready(function() { 
$("#slideshow_box") 
    .animate({"height": "400px"}, 500) 
    .animate({"width": "288px"}, 500); 
});

CSS

#slideshow_box{ 
    position:relative; 
    float:left; 
    height: 0px; 
    width: 0px; 
    margin-right: 60px; 
    overflow:hidden; 
}

來源

2011-09-19 Farreal

如果CSS處理一切的大小調整，只是搶在頁面上別的東西，並檢查它的大小來決定如何大小的幻燈片。 – yoozer8

_「我該如何改變」_首先要做的是爲自己設定目標。你想與衆不同的東西，例如_我每天運動15分鐘_。其他建議是閱讀一些很好的自助書籍。 :)（無法幫助它） – Eonasdan

利用屏幕寬度和高度。基於這些編寫代碼

$(document).ready(function(){ 
    if ((screen.width>=1024) && (screen.height>=768)) { 

     alert('Screen size: 1024x768 or larger'); 

    } 
    else { 
     alert('Screen size: less than 1024x768, 800x600 maybe?'); 

    } 
});

謝謝..

來源

2011-09-19 13:22:07

最簡單的方法可能是通過使用變量通過JavaScript訪問當前屏幕分辨率複製的媒體選擇邏輯：

screen.width 
screen.height

來源

2011-09-19 13:17:34 Alnitak

我該如何改變我的Jquery幻燈片，以改變不同屏幕分辨率的尺寸

回答

相關問題