繁体   English   中英

Raphael JS:点击是在拖动结束时触发的

[英]Raphael JS: Click is triggered at end of drag

以下代码的目的是仅在单击时更改圆形颜色,而不是在拖放后鼠标向上更改圆形颜色。 出于某种原因,Raphael正在点击鼠标上的点击事件。 怎么预防这个? 这是jsfiddle

这是HTML:

<div id="canvas"></div>

这是javascript:

Raphael.st.draggable = function() {
  var me = this,
  lx = 0,
  ly = 0,
  ox = 0,
  oy = 0,
  moveFnc = function(dx, dy) {
      lx = dx + ox;
      ly = dy + oy;
      me.transform('t' + lx + ',' + ly);
  },
  startFnc = function() {},
  endFnc = function() {
      ox = lx;
      oy = ly;
  };

  this.drag(moveFnc, startFnc, endFnc);
};



var paper = Raphael(document.getElementById('canvas'));
var mySet = paper.set();

var c = mySet.push(paper.circle(50, 50, 50).attr('fill', 'red'));

mySet.draggable();

c.click(function(evt) {
   this.attr({"fill": "#2e2e2e" });
});

这是我用来拖动集合的东西:

http://jsfiddle.net/Margo/Q3EBw/5/

paper = Raphael(0, 0, 500, 500);
var ox = 0;
var oy = 0;
var screenSet = paper.set();
screenSet.push(paper.rect(0, 0, 100, 75, 0).attr({
        fill: 'red', stroke: 'none'
    }));

screenSet.push(paper.text(0 , 0 ,"Text").attr({ "text-anchor": "start" }));

    start = function() {

        ox =  this.attr("x");
        oy = this.attr("y");
        screenSet.attr({
            opacity: 1
        });
},

    move = function(dx, dy) {
        var att ={
            x: ox + dx,
            y:oy + dy
        };
        screenSet.attr(att);
    },
    up = function() {
        this.attr({
            opacity: .5
        });
        ox = 0, oy = 0;
    };
screenSet.drag(move, start, up);

希望它能帮到你:)

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM