Вы можете получить размеры изображения из javascript и затем принудительно расположить их как фоновое изображение с фиксированной высотой / шириной div. Вы можете получить высоту ширину через JavaScript после загрузки изображения.
IMG нагрузка см .: http://www.w3schools.com/jsref/event_img_onload.asp
Вот что вы делаете
<img onload="redoImage(this)" src="<%=user["pic_big"]%>" id="pic1">
или через js
var img=new Image();
img.onload = redoImage();
img.src="<%=user["pic_big"]%>";
тогда это реальное место, где изображение появляется, и вы установите его фоновое изображение с соответствующим смещением, чтобы изображение отображалось правильно. Требуется некоторая математика, чтобы выяснить, как получить смещение x или off y.
<div id="pic1-holder" style="width:120px; height:120px;"> </div>
function redoImage(this) {
var xOffset = computeXoffset(this.width, 120);
var yOffset = computeYoffset(this.height, 120);
// now set the background image of the div
// and the offset of that background image
};
У меня есть производственный код, который прекрасно это делает. Удачного кодирования.