2011-05-29 38 views
0

我有一個set Raphael圖片,隨機放在畫布上。我想這些圖像有一個過渡,但我想我有我的語法錯誤:(任何想法拉斐爾和集合中的節點

的jsfiddle:http://jsfiddle.net/neuroflux/VS6gT/1/(編輯,包括庫)

代碼段:

for (var i = 0; i <= a; i++) { 
        var ax = Math.floor(Math.random() * dw) + 1; 
        var ay = Math.floor(Math.random() * dh) + 1; 
        var ao = Math.floor(Math.random() * 10) + 1; 
        var ac = Math.floor(Math.random() * 4) + 1; 
        if (ac == 1) { col = 'earth.gif'; } else 
        if (ac == 2) { col = 'jupiter.gif'; } else 
        if (ac == 3) { col = 'neptune.gif'; } 
        var planetName = nameGen(); 
        st.push = (
         planet = r.image(col, ax,ay,ac,ac).attr({ 
          'fill':'#fff', 
          'opacity':'0.'+ao, 
          'stroke-width':0, 
          'cursor':'pointer' 
         }).id = planetName 
        ); 
       } 

st.mouseover(function() { 
        if (info) { info.remove(); } 
        this.node.animate({ 
         'scale':30 
        }, 250); 
        this.animate({ 
         'rotation':999 
        }, 25000); 
        info = r.rect(5,5,200,150).attr({ 
         'fill':'#fff', 
         'stroke':'#ff0000' 
        }); 
        infoText = r.text(75,25,'PLANET NAME: \r\n'+this.id+'\r\n\r\nDISTANCE: \r\n'+(1.0 - this.attr('opacity'))*10).attr({ 
         'font-size':14 
        }); 
       }).mouseout(function() { 
        this.animate({ 
         'scale':1 
        }, 250); 
       }); 

回答

2

好像附着事件設定不起作用,但你可以將他們引導到行星爲你創建它們:

var planet = r.image(col, ax,ay,ac,ac).attr({ 
     'fill':'#fff', 
     'opacity':'0.'+ao, 
     'stroke-width':0, 
     'cursor':'pointer' 
}); 
planet.id = planetName; 
st.push = planet; 
planet.mouseover(function() { 
    if (info) { info.remove(); } 
    this.animate({ 
     'scale':30 
    }, 250); 
    this.animate({ 
     'rotation':999 
    }, 25000); 
    info = r.rect(5,5,200,150).attr({ 
     'fill':'#fff', 
     'stroke':'#ff0000' 
    }); 
    infoText = r.text(75,25,'PLANET NAME: \r\n'+this.id+'\r\n\r\nDISTANCE: \r\n'+(1.0 - this.attr('opacity'))*10).attr({ 
     'font-size':14 
    }); 
}).mouseout(function() { 
    this.animate({ 
     'scale':1 
    }, 250); 
    }); 
} 

唯一的其他次我必須改變的是this.node.animatethis.animatethen it seems to be working

+0

好吧,那會做!謝謝 – 2011-05-30 11:19:26