如何解决集合中的Raphael和定位节点
| 我在画布上随机放置了ѭ0的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);
});
解决方法
将事件附加到集合似乎无效,但是您可以在创建事件时将它们直接附加到行星上:
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.animate
更改为this.animate
,这似乎很有效。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。