javascript拉斐尔对象函数传递

javascript raphael object function passing

本文关键字：函数 对象 javascript      更新时间：2024-06-09

我很抱歉问这个问题，但我只是想在今天早上寻求一些指导。我只是想创建一个函数，这样我就可以通过传递拉斐尔元素来让它发光。下面是我的代码。为什么这不起作用？

var paper = Raphael("playarea", 500, 500);
var rectangle = paper.rect(100, 100, 200, 200, 4);
function elemHover(var el)
{
    el.hover(
    // When the mouse comes over the object //
    // Stock the created "glow" object in myCircle.g
   function() {
    this.g = this.glow({
        color: "#0000EE",
         width: 10,
         opacity: 0.8
     });
    },
    // When the mouse goes away //
    // this.g was already created. Destroy it!
    function() {
     this.g.remove();
    });
}
elemHover(rectangle);

这是小提琴http://jsfiddle.net/aZG6C/15/

您应该fill元素（在我们的例子中是矩形）来触发悬停。

rectangle.attr("fill", "red");

试试这把小提琴http://jsfiddle.net/aZG6C/17/

完整的代码看起来像

<div id="playarea"></div>
​<script type="text/javascript">
var paper = Raphael("playarea", 500, 500);
var rectangle = paper.rect(100, 100, 200, 200, 4);
function elemHover(el)
{
    el.hover(
    // When the mouse comes over the object //
    // Stock the created "glow" object in myCircle.g
    function() {
     this.g = this.glow({
         color: "#0000EE",
         width: 10,
         opacity: 0.8
     });
    },
    // When the mouse goes away //
    // this.g was already created. Destroy it!
    function() {
     this.g.remove();
    });
}
rectangle.attr("fill", "red");
elemHover(rectangle);
</script>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

更新

只有当元素中填充了某些内容时，才会触发悬停事件。如果你想有一个透明的元素，你可以尝试

rectangle.attr("fill", "transparent");

在这里检查小提琴http://jsfiddle.net/aZG6C/20/

相关文章：