2013-03-25 63 views
1

我不習慣使用mooTools,它看起來很像Prototype JS。任何人都可以告訴我如何將這個綁定到每個類?mooTools綁定所有類

// This grabs all the classes 
var mousy = $$('.hf-item-images'); 

// I don't think this is correct to apply this scroller to all the above classes 
var scroll = new Scroller(mousy, {area: 100, velocity: 1}); 

// Mousemove 
mousy.addEvent('mouseover', scroll.start.bind(scroll)); 
mousy.addEvent('mouseout', scroll.stop.bind(scroll)); 
+0

這確實是不正確的:'VAR滾動=新滾輪(灰褐色,{面積:100,速度:1});' - 滾輪構造exepts單個元件:[滾輪](HTTP:// mootools的。 net/docs/more/Interface/Scroller) - 你想做什麼不清楚 - 如果你想將所有的穆斯林元素應用爲一個滾動器,只需構建一個簡單的類來做到這一點 - 你將需要調用Scroller元素 – Adidi 2013-03-25 19:59:16

回答

5

你需要更聰明一點,循環瀏覽nnnn項目,以使scollers成本很高。每個人都要附上一對事件。

給出的標記,像這樣:

<div id="container"> 
    <div class="hf-item-images">...</div> 
    <div class="hf-item-images">...</div> 
</div> 

您可以在父委託的東西,只實例化一個滾動例如在需要它的元素,之後再使用它。

var container = document.id('container'), 
    settings = { 
     area: 100, 
     velocity: 1 
    }; 

container.addEvents({ 
    'mouseover:relay(.hf-item-images)': function(e, el){ 
     var scroll = el.retrieve('scroller'); 
     if (!scroll){ 
      // create instance the first mouseenter and store for later 
      scroll = new Scroller(el, settings); 
      el.store('scroller', scroll); 
     } 
     scroll.start(); 
    }, 
    'mouseout:relay(.hf-item-images)': function(e, el){ 
     el.retrieve('scroller').stop(); 
    } 
}); 
+1

謝謝大師! :) – JREAM 2013-03-27 12:59:35