JQuery FancyBox - 显示覆盖图像

我正在开发用户配置文件图像控件。此控件允许用户上传他们自己的自定义图像作为他们的个人资料，显示为隐藏在页面角落的小缩略图。我正在使用FancyBox来显示全尺寸图像。问题是，上传新图像时，FancyBox会显示与原始图像尺寸相同的新图像！JQuery FancyBox - 显示覆盖图像

如果每个图片上传都会生成一个新的url，但是我根据用户的ID获取了我的图片url，则不会存在此问题。例如：url =“../ profileImages/user_3.jpg” 换句话说，上传新的配置文件图像将覆盖当前图像。

对于你们中的一些专家，我已经尝试向url中添加一个查询参数，如“../profileImages/user_3.jpg?value=123”，它不起作用。

没有深入了解我使用的所有代码，我创建了一个可以充分证明问题的裸机示例。

<html> 
<head runat="server"> 
<title></title> 
<script src="../jquery-1.6.2.js" type="text/javascript"></script> 
<script src="../fancybox-1.3.4.js" type="text/javascript"></script> 
<script src="../fancybox-1.3.4.pack.js" type="text/javascript"></script> 
<link href="../jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css" /> 

<script> 
$(document).ready(function() 
{ 
$("#example").fancybox() 
}); 
</script> 
</head> 
<body runat="server"> 
<div> 
<a id="example" href="TestImg.jpg"><img alt="example" src="TestImgThumb.jpg" /></a> 
</div> 

</body> 
</html>

创建两个图像。最好是人，所以你可以看到规模伸展问题更清晰。确保第一张图像明显比第一张图片大，并命名为：TestImg.jpg
打开浏览器的网页，通过FancyBox查看图像。
现在删除第一图像和第二（较小）图像重命名为：TestImg.jpg
打开网页，再次看到这个问题。超链接中的图像将是正常的，但FancyBox呈现的图像被拉伸到原始图像的尺寸。

如果您需要进一步澄清任何事情，我会很乐意承诺。

来源

2012-02-20 RichardB

图像被缓存，但如果你重新加载页面，它不会发生，是吗？ – JFK 2012-02-21 00:05:17

由于图像缓存问题，新上传的图像将永远不会显示，因为浏览器会看到相同的网址并显示缓存的图像。这不是我的问题，因为显示的是新上传的图像，但它被拉伸至原始图像的尺寸。 – RichardB 2012-02-21 16:21:07

没有人有这个问题的答案!!？ – RichardB 2012-02-23 16:18:25

我通常为缩略图创建时间日期标记的图像。例如，在你的情况下，[UserId_yyyyMMdd_hh_mm_ss] .jpg然后将其存储在我的数据库中。我还会覆盖文件系统上的原始文件，以便您稍后可以操作该文件，但您想要提供的映像是使用唯一名称存储在数据库中的映像。

它似乎是要避免将图像URL（或图像）存储在数据库中，这就是为什么你有缓存问题。仅使用用户标识不是一个好主意，因为这些图像不是一个好主意，因为您会遇到缓存问题。

来源

2012-05-30 13:34:23 Chris

JQuery FancyBox - 显示覆盖图像

回答

相关问题