在 IE8 jQuery Cycle 中消失的图像

Question

http://www.lunatestsite.co.uk/products/lifestation

我这辈子都无法解决这个问题。到目前为止只在 IE8 中。我在主页周期中遇到了同样的问题，但设法通过声明宽度、高度和背景来解决：none !important 在有问题的 img 上。

我认为这可能是 png 问题，但 jpg 也是如此：

http://www.lunatestsite.co.uk/test-disappearing-jpgs

相同的结果：幻灯片中两个图像中的第一个通常闪烁，然后消失。

任何想法都值得赞赏。

已解决：我最初的修复方法最终也解决了这个问题：添加背景：不重要！，并声明宽度/高度。它不适用于其他模板，因为我使用的是类而不是 ul#product-images 的 id。

耻辱，它燃烧！很抱歉浪费了大家的时间。

body.home #front-slider #front-slides .slide{
background:none !important;
width: 980px;
height: 389px;
}

body.home #front-slider #front-slides .slide .slide-image img{
    background:none !important;
    width: 629px;
    height: 345px;
}

body.page-template-page-product-view-php ul#product-images .slide, body.page-template-page-product-view-wide-php ul#product-images .slide{
    background:none !important;
    width: 970px;
    height: 300px;
}

Answer 1

听起来图像仍在加载中。

试试这个...

$(window).load(function() {
    $('#product-images, #front-slides').cycle({
        timeout: '7000',
        next: '#next',
        prev: '#prev',
        pager: '#pager',
        pagerAnchorBuilder: function(idx, el) {
                return '<a href="#"></a>';
            }
    });
 });

window.load() 将在 DOM 和页面图像加载后触发，而 document.ready() 仅在 DOM 加载后触发。