1

この質問をして申し訳ありませんが、今朝のちょっとしたガイダンスを探しています. Raphael 要素を渡すだけで、Raphael 要素を光らせることができる関数を作成したいだけです。以下は私が持っているコードです。これが機能しないのはなぜですか?

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/

4

1 に答える 1

2

ホバーをトリガーするにはfill、要素 (この場合は四角形) を使用する必要があります。

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

このフィドルを試してくださいhttp://jsfiddle.net/aZG6C/17/

完全なコードは次のようになります

<div id="playarea"></div>

​&lt;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>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

アップデート

Hover イベントは、要素が何かで満たされている場合にのみトリガーされます。透明な要素が必要な場合は、試すことができます

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

ここでフィドルを確認してくださいhttp://jsfiddle.net/aZG6C/20/

于 2012-07-31T15:15:35.620 に答える