jQuery/CSS 图像问题。 Opera 仅加载部分图像，原因不明

Question

您在使用 Internet Explorer 时遇到日常问题并不奇怪，但当您实际使用像 Opera 这样的浏览器时，您会感到有点惊讶。

我在 Firefox、Chrome 和 IE 上完成了大部分工作（除了 fancybox 没有将所有 IE 修复验证为绿色这一事实之外，但这是另一个问题）。

无论如何，我似乎无法弄清楚的问题最好用屏幕截图来描述！

http://patrikarvidsson.com/stuff/operaissue.jpg

悬停似乎有效，点亮了图像就像它应该做的那样。但它似乎没有像在其他浏览器中那样正确显示“淡出”图像。如上所示，仅显示了部分图像。

Opera 用户可以在 hxxp://www.patrikarvidsson.com/project/portfolio 上查看该网页，

我从今天开始安装了最新的 Opera，为自己重新创建了这个，正如一位朋友报告的那样天前。

// LiveQuery for Fade-Effect

$(".thumb").livequery(function(){ 
$(".thumb").css("opacity","0.6");
    $(".thumb").hover(function () {
        $(this).stop().animate({
           opacity: 1.0
        }, "fast");
},
 function () {
    $(this).stop().animate({
        opacity: 0.6
        }, "fast");
    });
});

其中一个链接的 jQuery .load 代码；

    $("a.dartLink").click(function(){
    $('div#content').load("content/digitalart.php");
    return false;
});

画廊页面之一的链接（由列表包围）；

    <a href="index.php?l=digitalart" class="dartLink gallery"><span>Digital Illustrations</span></a>

其中一个拇指的 HTML；

<div class="thumbbox">
<a rel="digitalart" href="thumblink.jpg" class="thumb" title="Astralis"><img src="images/thumbs/AstralisSmall.jpg" alt="" /></a></div>

但转念一想，这可能与 jQuery 无关。我添加了 CSS 标签以防万一。虽然我仍然不知道是什么原因造成的。不幸的是，自从我编辑这篇文章以来，图像和超链接限制再次适用，因为我是新用户。

编辑了帖子。我想我现在已经成功包含了所需的代码。

Answer 1

Patrik，

这不是你问题的核心（在你提供一些我们可以分析的代码之前我不会回答这个问题），但是在使用 IE 时要小心灯箱插件。当页面上有很多图像时，它的行为非常奇怪（即[没有双关语]它会停止整个浏览器的执行，甚至减慢操作系统的速度，直到加载所有图像）。我解决这个问题的方法是使用 colorbox 插件，您可以在这里找到它：

http://colorpowered.com/colorbox/

我发现它和 lightbox 一样灵活，只不过它在 IE 中运行得很好。

Answer 2

我没有安装 Opera，我非常确信您的问题是因为您正在使用包含缩略图的框的 display:inline 。
尝试：

.thumbbox {
display: inline-block;
padding: 0px;
}

Opera 只是将图像裁剪为容器的大小（我使用 chrome 开发工具来验证）。您需要将 IE6 和 IE6 的显示设置为内联。 7 并应用 min-height:1% 或 zoom:1 hack 以获得相同的效果。或者，您可以浮动这些 div，这将需要额外的安全保护以确保它们正确包含。

希望有帮助！

编辑

另外，

可能需要设置为 display:block 因为它们都是内联元素。