当拉斐尔附近的一个元素时发生鼠标事件

时间:2012-01-02 17:59:08

标签: mouseevent raphael

根据这个问题 Raphael - event when mouse near element

我在另一个矩形周围创建一个不可见的矩形, 当鼠标悬停在那个大的矩形上时,会出现一个圆圈。 但因为大矩形位于小矩形之上, 当鼠标位于小矩阵上时,我无法处理另一个事件。

(如果小矩形在顶部,当我到达小直肠时,该点将消失) 我还希望与圈子有另一个活动。

这有什么解决方案吗? Hier是code

1 个答案:

答案 0 :(得分:1)

用较小的矩形模仿较大矩形的事件:

var paper = new Raphael(0, 0, 500, 500);

createRect(100, 100, 100, 50);

function createRect(x, y, width, height) {
    var boundrect = paper.rect(x - 30, y - 30, width + 60, height + 60).attr({
            "fill": "pink",
            "stroke": "none"
        }).mouseover(function(event) {
            topCtrl.show()
        }).mouseout(function(event) {
            topCtrl.hide()
        })

        ,

        rect = paper.rect(x, y, width, height).attr({
        "fill": "white",
        "stroke": "red"
    }).mouseover(function(event) {
        topCtrl.show();
        topCtrl.attr({
            "fill": "white"
        })
    }),
        topCtrl = paper.circle(x + (width / 2), y, 5).attr({
            "fill": "red"
        });
}