在触发JQuery幻灯片之前加载所有图像

我修改了Visual Idiot的Unslider(http://unslider.com/)以适应基于图像比例的多宽度幻灯片,但是在这个过程中,我遇到了一个错误导致幻灯片加载为微小的缩略图(我认为在图像没有一直加载的情况下).这是问题#1.所以我试图等到所有图像都加载完毕.但我还没有找到成功做到这一点的方法.这是问题#2.

这是我在Unslider init()函数中添加的代码:

_.init = function(el, o) {
  //  Check whether we're passing any options in to Unslider
  _.o = $.extend(_.o, o);

  _.el = el;
  _.ul = el.find(_.o.items);
  _.max = [el.outerWidth() | 0, el.outerHeight() | 0];
  _.max = [100, 100];
  _.li = _.ul.find(_.o.item).each(function(index) {
    var me = $(this);
    var an_image = me.find('img');
    an_image.load(function() {
      width = an_image[0].naturalWidth,
      height = an_image[0].naturalHeight;

      setSlideHeight(an_image, width, height, 300, 20);
      if ( an_image.parent().parent().is(":last-child") ) {

        _.el.css("width", 900);
      }
    })  

    //  Set the max values
    //if (width > _.max[0]) _.max[0] = width;
    //if (height > _.max[1]) _.max[1] = height;
  });

这里是我的Ruby部分内容,脚本内联用于在加载所有图像时触发Unslider.

<% if @page.cap_gallery_images.any? %>
  
<% end %>

问题是看起来图像加载处理程序并非全部触发.在我正在使用它的页面的上下文中查看它:http://penumbra-2.herokuapp.com/education