如何动态修改属性(onmouseover)

kinetic js - how do I modify attributes dynamically (onmouseover)

本文关键字：修改 属性 onmouseover 动态 何动态      更新时间：2023-09-26

我有以下代码，但是位置不随鼠标悬停而变化-我错过了什么?

function drawOverlay() {
    var stage = new Kinetic.Stage({container: 'overlay'});
    var layer = new Kinetic.Layer();
    var rect = new Kinetic.Rect({
        x: 239, y: 75,
        width: 100, height: 50,
        fill: 'green', stroke: 'black', strokeWidth: 4
    });
    rect.on('mouseover', function(e) {rect.setPosition({x: 50, y: 5 0});});
    layer.add(rect);
    stage.add(layer);
}

这里有两个问题:

  1. 你的y值有一个空格:"50"vs。"50"，这会导致javascript解析错误。
  2. 改变节点位置后需要重新绘制图层

那么试试这个:

rect.on('mouseover', function(e) {
    rect.setPosition({x: 50, y: 50}); 
    layer.draw(); 
});
相关文章：