Question

我成功制作了一张小地图，在鼠标悬停时显示.SVG。它立即显示图像，然后离开鼠标。我尝试添加＆＃39; .animate＆＃39;属性使它们淡入淡出，但我尝试过的每一种方式都失败了？希望快速解释一下！

var rsr = Raphael（＆＃39; map＆＃39;，＆＃39; 900＆＃39;，＆＃39; 900＆＃39;）;

var regions = [];

var circle_a = rsr.circle（584,556,88）; circle_a.attr（{fill：＆＃39;＃2a4b4d＆＃39;，opacity：＆＃39; 0＆＃39;}）。data（{＆＃39; id＆＃39;：＆＃39; circle_a＆＃39; ，＆＃39;地区＆＃39;：＆＃39;圈A＆＃39;}）; regions.push（circle_a）;

for（var i = 0; i＆lt; regions.length; i ++）{

regions[i].mouseover(function(e){
  this.node.style.opacity = 1;
});

regions[i].mouseout(function(e){
    this.node.style.opacity = 0;
});

}

Answer 1

regions[i].mouseover(function(e){
  circle_a.animate({ "fill-opacity": "1" }, 2000);
    document.getElementById('region-name').innerHTML = this.data('region');
});

regions[i].mouseout(function(e){
circle_a.animate({ "fill-opacity": "0" }, 2000);
});

使用Raphael动画不透明

1 个答案: