javascript raphael對象函數傳遞

Question

我很抱歉提出這個問題，但我只是在今天上午尋找一些指導。我只是想創建一個函數，這樣我就可以通過傳入該元素來使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/

Answer 1

你應該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/