mootoolsに読み込みを挿入するには？

Question

今、mootoolsでスライドショーバナーを作成しています。すべての画像がロードされた後に画像をロードしたい場合は、スライドショーですべての画像を表示してください。

私の質問はどのようにLOADINGを置くのですか？ここ

私のコード：

<script type="text/javascript" src="js/mootools-1.2.4.js"></script> 
    <script type="text/javascript"> 
     window.addEvent('domready',function() { 
      /* settings */ 
      var $xxa = jQuery.noConflict(); 

      var showDuration = 3000; 
      var container = $('slideshow-container'); 
      var images = container.getElements('img'); 
      var currentIndex = 0; 
      var interval; 
      /* opacity and fade */ 
      images.each(function(img,i){ 
       if(i > 0) { 
        img.set('opacity',0); 
       } 
      }); 
      /* worker */ 
      var show = function() { 
       images[currentIndex].fade('out'); 
       images[currentIndex = currentIndex < images.length - 1 ? currentIndex+1 : 0].fade('in'); 
      }; 
      /* start once the page is finished loading */ 
      window.addEvent('load',function(){ 
       interval = show.periodical(showDuration); 
      }); 
     }); 
    </script> 

Answer 1

は、複数の画像を読み込むことができAsset.js

からAsset.images MooToolsは、より多くのを見て、それは多くのために/ onprogress onCompleteのイベントを発生させます。それは少し無駄ですので、それは他の要素だけでなく、興味のあるあなたのイメージをお待ちしています - 彼らは、DOMにある場合、すべての後にトリガされますloadが行われている - http://mootools.net/docs/more/Utilities/Assets#Asset:Asset-images

は何をやっていることはイメージがすでにロードされている意味します

あなたはまだ '読み込み中'と言うDOMAIN上に新しい要素を作成してonloadを破壊し、そのままコードを保存できます。

例えば、

var loader = new Element("div", { 
    html: "loading..." 
    tween: { 
     onComplete: function() { 
      this.element.destroy(); 
     } 
    } 
}).inject(document.id("sometarget")); 
... 
window.addEvent('load', function(){ 
    loader.fade('out'); // will fade and destroy it. 
    interval = ... 
});