Question

我正在通过一个物体对象循环，以雇用员工年份并显示他们的肖像和名称。这是我添加到SharePoint网站内容编辑器Web部件的自定义html / javascript文件。

var classes = { 
2013: { 
"image/path.png" : "name of employee", 
"image/path2.png" : "name of employee2" 
}, 
2012... 
}

我正在使用以下jQuery加载图片

        jQuery(document).ready(function($){
            $('li').on('mouseover', function(e){
                $('#overlay').empty();
                var title = $('<h2>');
                title.text('Class of ' +  e.target.id);
                $('#overlay').append(title);

                $.each(classes[e.target.id], function(k, v) {
                    var img = $('<img/>');
                    img.attr('src', k);
                    var $imgContainer = $("<span class='imagesContainer'>");
                    $imgContainer.append(img);
                    $imgContainer.append("<span class='names'>" + v + "</span>");
                    $('#overlay').append($imgContainer);
                }); 
            });
        });

要显示的HTML：

    <ul id="classes">
        <br>
        <li id="2013">Class of 2013</li>
        <li id="2014">Class of 2014</li>
        <li id="2015">Class of 2015</li>
    </ul>

    <div id="overlay"></div>

的问题：

1）当我将鼠标悬停在Class Years链接上时，它会显示所有肖像和名称，但有时并不会显示var classes = {对象中的所有图像。似乎有时并非所有人都加载。例如，Class of 2013在对象中有7个图像，因此jQuery $.each函数应该加载所有7个图像，但有时只出现6或5个。

2）IE8上根本不显示图像。当我将鼠标悬停在类上时，只显示标题“Class of 20XX”，并且没有图像/名称。我不认为这是一个jQuery版本问题。

FIDDLE HERE

在一组图片中随机消失的图片

0 个答案: