如何为draggable设置位置x和y

时间:2014-03-13 12:40:44

标签: javascript jquery

我的代码使用可拖动的jquery和jquery UI:

<html>
<head>

<title>Test</title>
<link rel="stylesheet" href="css/jquery-ui.css">
<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
<script src="js/jquery-ui.js"></script>

<style>
#draggable {border: 0px solid black; background-color : transparent; width: 150px; height: 150px; padding: 0.5em; }
</style>
<script>
$(function() {
$( "#draggable" ).draggable({
                start: function (e, ui) {
                    var parentOffset = $(this).parent().offset();
                    var relX = e.pageX - parentOffset.left;
                    var relY = e.pageY - parentOffset.top;
                    $("#start").html(" x: " + relX + ", y: " + relY);
                },
                stop: function (e, ui) {
                    var parentOffset = $(this).parent().offset();
                    var relX = e.pageX - parentOffset.left;
                    var relY = e.pageY - parentOffset.top;
                    $("#end").html(" x: " + relX + ", y: " + relY);
                },
                drag: function (e, ui) {
                    var parentOffset = $(this).parent().offset();
                    var relX = e.pageX - parentOffset.left;
                    var relY = e.pageY - parentOffset.top;
                    $("#current").html(" x: " + relX + ", y: " + relY);
                }

            });
});
</script>
</head>
<body>
<div id="draggable" class="ui-widget-content">Test</div>
 start Position:<span id="start"></span>
    <br />
    End Position:<span id="end"></span>
    <br />
    Dragging Position<span id="current"></span>
</body>
</html>

我需要为对象设置位置x和y。页面加载对象将在例如坐标x = 50和y = 50之后。我试图把start var relX = 50但它没有工作

0 个答案:

没有答案