Друзья картинки с размером - PullRequest
1 голос
/ 05 марта 2012

Мне в основном нужно воссоздать эту страницу: http://www.facebook.com/me/friends

Но: поскольку не все изображения являются реальными квадратами, мне нужно получить их размеры, чтобы обрезать их, используя CSS и скрытое переполнение (как в Facebookделает в основном).Я знаю, что есть способ получить квадратные изображения, но они бывают размером 50 на 50 пикселей (я хочу большие).

Я считаю, что FQL мог бы добиться этого, возможно, он начнется с чего-то вроде:

fql?q=SELECT name, pic_big FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1 = me())

1 Ответ

1 голос
/ 05 марта 2012

Вы можете получить размеры изображения из 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;">&nbsp;</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
};

У меня есть производственный код, который прекрасно это делает. Удачного кодирования.

...