Jquery循环插件和IE-预加载和重新调整大小，但在IE中图像不正确呈现/重新调整大小

重新调整图像大小并运行jquery cycle插件。我也在使用预加载插件

目标

我们的目标是从cms数据库获取大量图像，根据其纵横比与容器纵横比的比较，重新调整每个图像的高度或宽度，使其适合容器，将其置于容器中心，然后运行幻灯片项目图像

问题

循环幻灯片在图像加载之前运行图像太大，因此在图像显示之前可以循环播放3张幻灯片。希望它等待直到IAMGE加载完毕，并在加载时显示gif

下面是我运行的html和jquery代码，用于预加载、重新调整大小和运行循环幻灯片：

<div id="slideshow" class="single_project_images pics">
    <img src="/components/com_sedarticles/assets/1333588925" />
    <img src="/components/com_sedarticles/assets/1333852906" />
    <img src="/components/com_sedarticles/assets/1333852914" />
 </div>

剧本：

$(document).ready(function() {
    $(".single_project_images img").each(function(){
        $(this).imagesLoaded(function(){
            var w = $(this).width();
            var h = $(this).height();
            if( (w/h) < 0.85){
                $(this).height("541px");
                $(this).css("margin-left", parseInt((460 - $(this).width())/2)+"px");
            }else{
                $(this).width("460px");
                $(this).css("margin-top", parseInt((541 - $(this).height())/2)+"px");
            }
        }); 
});

    $('#slideshow').cycle({
        speed:  1000,
        timeout: 5000,  
        pager:  '#nav'
    }); 
});

---

图像2和3没有显示的原因是css中的边距顶部设置为1000px，并且没有进行调整，因为这两个图像不符合js中的if条件

为了防止幻灯片在图像加载之前就开始播放，您需要跟踪加载了多少图像，并在完成后进行调用循环

大概是这样的：

var totalimages = 6, imagesloaded = 0;

$('img').each(function() {

    this.onload = function() {
       imagesloaded++;
       if(imagesloaded === totalimages){
           //call cycle plugin
       }
    }

});

---

图像2和3没有显示的原因是css中的边距顶部设置为1000px，并且没有进行调整，因为这两个图像不符合js中的if条件

为了防止幻灯片在图像加载之前就开始播放，您需要跟踪加载了多少图像，并在完成后进行调用循环

大概是这样的：

var totalimages = 6, imagesloaded = 0;

$('img').each(function() {

    this.onload = function() {
       imagesloaded++;
       if(imagesloaded === totalimages){
           //call cycle plugin
       }
    }

});

---

你是什么版本的ie。我刚刚在ie8中检查了你的站点，它运行良好。你使用的是什么版本的ie。我刚刚在ie8中检查了你的站点，它运行良好。