動態設置圖像的寬度和高度與PHP等

所以 - 我有這個網站（Pickture），它允許用戶上傳幾乎任何尺寸的照片。這會導致顯示頭痛。

目前發生這種情況。該圖像是在一個容器DIV（我寧願不觸摸），並設置爲100％的寬度和高度留空。這意味着即使只有200x200，所有圖像也會被縮放到600x600左右。

我想發生的是這樣的。如果圖像的寬度大於650px，則將寬度設置爲100％。如果寬度小於此值，則將圖像的寬度設置爲圖像的寬度（實際大小）。

我想我大概可以做到這一點使用jQuery和PHP的組合 - PHP來獲取圖像的尺寸，並基於jQuery一些變量放在與PHP設置顯示尺寸 - 如：動態設置圖像的寬度和高度與PHP等

<script type="text/javascript"> 
    var imageWidth = <?php echo 'something';?> 
    if (imageWidth > 650) { 
      $('#image').css('width', '100%'); 
    } else { 
      $('#image').css('width', '<?php echo 'something';?>'); 
    } 
</script>

感謝任何能幫助我解決這個難題的人。

來源

2011-11-15 Alfo

您可能會發現這個有用：http://stackoverflow.com/questions/7553247/ php-image-resizing/7553540＃7553540 – Herbert

不，這不是他要問的@Herbert –

@Truth：有什麼區別？ – Herbert

我認爲你的想法應該可以正常工作。這是一個例子，它對我有用。（我設置的風格形象DIV因此這將是可見的。如果你想調整圖像本身，而不是DIV，它的工作原理是相同的。

<?php 
$image_path = "yourpath/yourimage"; 

list($width, $height, $type, $attr)= getimagesize($image_path); 
?> 

<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<title>zzz</title> 

<script type="text/javascript" src="pathtojquery/jquery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
var imageWidth = <?=$width?>; 
if (imageWidth > 650) { 
     $('#image').css('width', '100%'); 
} else { 
     $('#image').css('width', '<?=$width?>'); 
} 
}); 
</script> 

</head> 
<body> 
<div id='image' style='background-color: #ececec; border: 2px dotted #000000;'> 
<img src='<?=$image_path?>'> 
</div> 

</body> 
</html>

來源

2011-11-15 19:46:01