Question

我基本上需要重新创建此页面：http://www.facebook.com/me/friends

但是：因为不是所有的图像都是实际的正方形，我需要得到它们的尺寸，以便使用css和隐藏的溢出来裁剪它们（就像facebook基本上一样）。我知道有一种方法可以检索方形图像，但它们的尺寸为50px×50px（我想要大尺寸）。

我认为FQL可以实现这一目标，也许它会从以下内容开始：

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

Answer 1

您可以从javascript获取图像尺寸，然后强制将它们定位为固定高度/宽度div中的背景图像。在图像加载后，您可以通过javascript获取宽度的高度。

IMG onload请参阅：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或偏移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
};

我有完美的生产代码。快乐的编码。

朋友的照片有大小

1 个答案: