Question

所以我正在制作一张可拖动的图像。

非常简单，当您将图像拖动到特定位置的左侧或右侧时，我希望图像能够快速回到左侧或右侧。

在下面的小提琴中，我有左侧的功能..但我不太清楚确定右侧的最佳方法是什么，因为Jquery只允许顶部和左侧属性。

考虑这段代码：

$(function() {
$(".headerimage").css('cursor', 's-resize');
var y1 = $('.picturecontainer').height();
var y2 = $('.headerimage').height();
$(".headerimage").draggable({
    scroll: false,
    drag: function(event, ui) {
        if (ui.position.left >= 200) {
            ui.position.left = 0;
        }
    },
    stop: function(event, ui) {
        //####
    }
});

FIDDLE

Answer 1

要获取元素右侧的位置，我使用此jQuery：

var target = $("selector");
var result = target.position().left + target.width();

确保在获得此值时完全呈现元素。否则结果可能会被取消。

Answer 2

这个怎么样：

var rightOffset = $('.parent').width() - ( $(target).position().left +  $(target).width() )

注意：如果你有目标元素的边距和边框，我相信这个shoudn工作，不确定是否可以通过box-sizing来修复：border-box

Answer 3

这个怎么样

drag: function(event, ui) {
       if (ui.position.left >= 200 || ui.position.left <= -300) {
               ui.position.left = 0;
       }
},

http://jsfiddle.net/nk7wc/10/

$(function() {
     $(".headerimage").css('cursor', 's-resize');
     var y1 = $('.picturecontainer').height();
     var y2 = $('.headerimage').height();
     $(".headerimage").draggable({
          scroll: false,
          drag: function(event, ui) {
                if (ui.position.left >= 200 || ui.position.left <= -300) {
                      ui.position.left = 0;
                }
          },
          stop: function(event, ui) {
              //####
          }
     });
});

检查position.left的负值

Answer 4

获取位置 right = 0 。设置 left = leftposition 而不设置边距css已设置

var leftposition = $(parent).width()-$(child).width();

Answer 5

为我工作：

(function($) {
    $.fn.Right = function() 
    {
        return this.parent().outerWidth() - this.position().left + this.outerWidth();
    };
 })(jQuery);

要使用它：

$("selector").Right();

Answer 6

左侧+宽度位置。

$(ui).position().left + $(ui).width();

Jquery，得到position（）。元素的右边？

6 个答案: