試圖讓一個jQuery小部件響應

Question

嗨我想讓這個jQuery小部件去響應。 Iv嘗試用百分比替換寬度。我發現它最初在http://jqueryglobe.com/article/feature_list/，但該網站自從被刪除，我有我自己的網站在這裏http://www.piercemcgeough.co.uk/sidetabs/

該問題似乎是選項卡，因爲它是一個具有寬度和高度的設置圖像。

任何幫助，請大家。謝謝你

Answer 1

簡單地縮放一切可能是一個挑戰，因爲隨着圖像變小，它們的高度不能與顯示左邊的3個鏈接所需的內容相匹配。

目前的結構基本上是：

有關使用@media請求，並開始修改以此爲視點變小

#tabs #output .right 

什麼？

對於片劑

#tabs #output 
.right 

對於智能手機

#tabs 
#output 
.right 

的CSS將鬆散是

@media（最小寬度：768px）和（最大寬度：979px）{ /*用於平板電腦，將右下角放在左下角*/

.left，.right { 寬度：100％; }

}

@media（最大寬度：767px）{

/*下面片劑堆棧標籤頁，輸出和右垂直的div */

。左#tabs，。左#output，.right { 寬度：100％; }

此刻div＃feature_list的寬度被硬連線爲750px。可能很好將其改爲百分比（可能爲100％）。

您可能還需要給力的圖像輸出DIV東西來鱗片狀

ul#output li img{ 
width:100%; 
height:auto; 
} 

可以肯定會有比這需要更多的微調，但我認爲最重要的事情是，如果你想要使這個既響應又可用，你將需要開始考慮隨着視點變化而改變其佈局。你不會簡單地擴展一切。

祝你好運，這是一個有趣的網頁設計時間！