Facebook的圖像調整大小而不失去它的比例

-1

我想了解Facebook如何使圖像不失去它的比例，但仍然使用標準圖像大小。Facebook的圖像調整大小而不失去它的比例

有什麼想法嗎？

這是basicly就是我想做的事：

編輯：

比方說，我們有16：9的圖像，我想它適合方形讓說200x200px，圖像會拉伸，我不想要..我希望圖像的大小適合200x200px，但「切片」它，並顯示圖像的一部分。

例拉伸：http://img.movavi.com/how-to/ar3/01.jpg

例修正：http://img.movavi.com/how-to/ar3/02.jpg

感謝

來源

2014-03-26 TiagoF

你好，你可能想用一句話來說明你想要做什麼。圖像有點模糊，留下誤解的空間。我認爲...你可能想要做的東西像一個包裝與溢出div：隱藏然後設置圖像的寬度/高度最大寬度：100％;最大高度：100％;分別。否則，對於確定的啓動方式，您可以使用類似於php的getimagesize（）來確定其縱向或橫向是否相應地計算確切的縮放尺寸（溢出：隱藏以裁剪過多）。 – frankstuner

當你去Facebook上的相冊的圖像是206x206，但嘿仍然保持比例，我想要的是例如寬屏圖像時，調整到206x206不要得到拉伸和保持長寬比 – TiagoF

你在問什麼？我建議你嘗試編碼，然後用代碼回來，然後人們可以幫助你。 – frankstuner

我覺得你在做什麼是使用包裝DIV中的圖像後 '溢出：隱藏'。

檢查出來的這個例子中使用與先前提供的圖像： http://jsfiddle.net/92R4H/9/

.clipped-sml { width:200px; height:100px; overflow:hidden; } 
.clipped-sml img { width:auto; height:100%; float:right; } 

/* Pls note: the float:right is only there to show the corrected image is scaling correctly :) */

從本質上講，你可以縮小圖片與父DIV一致。溢出：隱藏的規格會導致一些裁剪，如果您的圖像變化的比例，即16：9至4：3沒有拉伸。

來源

2014-03-26 13:11:07 frankstuner

它的作品，但我也想垂直的圖像不會受到影響..：/我不知道如何做到這一點proply：/ – TiagoF

最好的將是調整圖片大小（我可以做到這一點通過PHP），然後以某種方式發送圖像到與隱藏溢出的div – TiagoF

我在過去完成這一方式是通過使用getimagesize（）在PHP中找出哪個更大（寬度或高度），然後使用if每個聲明。然後，我使用計算結果來計算溢出會切掉多少：隱藏，將該數量減半並將其應用於負邊距（因此，如果它的縱向圖像，我會縮放到寬度，然後使用保證金頂部： - [儘管計算將它帶到中心]我不確定這是否是最佳做法，但這是我過去的工作方式。 – frankstuner

Facebook的圖像調整大小而不失去它的比例

回答

相關問題