Question

我正在尝试使用javascript raphael并尝试了解它。目前我正试图让它当用户盘旋在raphael的一个圆圈上，我已经绘制它将创建一个简单的悬停混乱像喜。然而，我在这一部分坚持到底，我似乎无能为力，任何有关这方面的帮助都会很棒。

Javascript：

window.onload= function (){ 
    var paper = new Raphael( 0, 0, 400, 400);
    var backGround = paper.rect(0, 0, 400, 400);
    backGround.attr({ fill: "orange"});
    var face = paper.circle(200,200,100);
    face.attr({ fill: "Red"});
};

HTML

<div class= "bot">
    <p>Hi there</p>
</div>

Answer 1

只需使用Raphael website上记录的Element.hover()功能。

更新：如果您将其复制到自己的计算机上并在本地运行，则下面发布的代码段有效。但是，要在Stack Overflow上实际运行此片段，它只适用于某些浏览器（例如，它适用于Firefox，但不适用于Chrome），可能是由于不同的浏览器允许或不允许代码片段加载外部库，如Raphael .js，根据此代码段中的要求。

window.onload = function() {

  var paper = new Raphael(0, 0, 400, 400);

  var backGround = paper.rect(0, 0, 400, 400);

  backGround.attr({
    fill: "orange"
  });

  var face = paper.circle(200, 200, 100);

  face.attr({
    fill: "Red"
  });
  
  face.hover(hoverHandler);

};

function hoverHandler() {
  alert("hi");
}

<script src="http://github.com/DmitryBaranovskiy/raphael/raw/master/raphael-min.js"></script>
<div class="bot">
  <p>Hi there</p>
</div>

Javascript悬停功能

1 个答案: