I am trying to get a safe position specification for my moveable div in several window solutions and sizes. I want to have one 0 position at the left side of the droppable area (#drop1). The jQuery-function position() is not enough for this task.It is understandable what I mean? I do there an alert with several position specifications and differences between, but I don't get an steady result for the position of my moveable div. jsFiddle
alert('e.pageY-this.offset().top:'+(e.pageY - $(this).offset().top)+"\n"
+'e.pageX-this.offset().left: '+(e.pageX - $(this).offset().left)+"\n"
+'e.pageX/e.pageY: '+e.pageX+'/'+e.pageY+"\n"
+'offset(left/top): '+$(this).offset().left+'/'+$(this).offset().top+"\n"
+'posLeft/pos.top: '+pos.left+'/'+pos.top+"\n"
+'draggable.position(left/top): '+ui.draggable.position().left+'/'+ui.draggable.position().top+"\n"
+'draggable.offset(left/top): '+ui.draggable.offset().left+'/'+ui.draggable.offset().top+"\n"
+'dropPositionX-dragItemOffsetX: '+dropPositionX+' - '+dragItemOffsetX+"\n"
+'innerWidth: '+window.innerWidth+"\n"
+'Main centered area width: '+$('#main').css('width')+'- bar left width: '+$('.col').css('width')+"\n"
+'position calculated: '+((window.outerWidth/2-parseInt($('#main').css('width'))/2+100)));
Html:
<div align="center" width="100%">
<div id="drag1" class="ui-widget-content" rel="a"><p>drag 1</p></div>
<div id="drag2" class="ui-widget-content" rel="b"><p>drag 2</p></div>
<div id="main">
<div class="col"> </div>
<div id="drop1" class="bg1">
<div id="drop-inner1" class="widget1"><p>AREA 1</p></div>
<div id="drop-inner2" class="widget1"><p>AREA 2</p></div>
</div>
<div class="col"> </div>
</div>
</div>
<div style="clear: both;"> </div>
I found a solution by myself.
THIS was what I am searching for:
var diffDragX = (ui.draggable.offset().left - $('#drop1').offset().left);
var diffDragY = (ui.draggable.offset().top - $('#drop1').offset().top);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.