Question

我在编程中使用以下jQuery-UI代码，有人知道如何知道，在调整特定div的大小时，event.pageX和event.pageY是增加还是减少。

CODE：

fontSize = parseInt($(' span',this).css('fontSize'));
$(this).resizable({
               disabled:false,
               handles: 'nw, ne, se, sw',
               resize: function(event, ui) { 
                         xvalue = event.pageX;
                         yvalue = event.pageY;
                         fontSize = fontSize+.1;
                         $(" span",this).css("fontSize",fontSize);
                       }
});

任何人如何知道xvalue和yvalue是增加还是减少？

Answer 1

var fontSize = parseInt($('span', this).css('fontSize'));
var xValue, yValue;

var f = function(event, ui) {
   var isXIncreasing = xXalue < event.pageX;
   var isYIncreasing = yValue < event.pageY;
   // ^ you can do something with these now

   xValue = event.pageX;
   yValue = event.pageY;
   fontSize = fontSize+.1;
   $('span', this).css("fontSize",fontSize);
};

$(this).resizable({
    disabled: false,
    handles:  'nw, ne, se, sw',
    resize:   f
});

Answer 2

您可以比较ui.originalSize和ui.size，看看当前的大小调整操作是在减少还是增加大小。

例如：

resize: function(event, ui) { 
    if (ui.size.height > ui.originalSize.height) {
        // element is taller than before
    } else {
        // element is the same size or smaller than before
    }
}

通过类比，您可以使用ui.size.width和ui.originalSize.width来查看元素是否比以前更宽。

See the API

如何知道event.pageX和event.pageY在jQuery-Ui中增加或减少？

2 个答案: