JQuery 可拖动图像并保存位置

好吧，这变得很尴尬，已经搜索并尝试了大约 5 个小时，但我只是在兜圈子......

场景很简单：它是用户个人资料的标题图像，可以将其拖动到某个位置，然后将图像的顶部位置保存到数据库中。

感谢 Beetroot-Beetroot 的“遏制：‘父级’”，我开始关注这段代码，它实际上按照我想要的方式做出反应！除了一个大问题。图片只是跳到顶部或底部。没有流畅滚动吗？如果我将“父级”更改为“父级”，它会很好地滚动，但是......当然，遏制不再存在了。帮助？ ：D

The JS

$(function(){
    $(".headerimage").css('cursor','s-resize');
    $(".headerimage").draggable({ containment: 'parent', scroll: false, axis: "y",    stop: function(event, ui) {
            var data = "profileheaderposition="+ui.position.top;
            var destination = "/modules/users/profile/save.php";
            get_data(data, destination, function(test){
                notice(test);
            });
        }
    });                 
});

所以最后但并非最不重要的一点是，标题是这样包含的：

<div class="<?php if ($user->id == $profileuser->id) echo "changer"; ?> ui-corner-all" id="profileheader" style="overflow: hidden; width: 650px; height: 260px; position:relative;">
<?php if($profile->profileheader){
    $size = getimagesize($profile->profileheader);
?>
<img id="" class="draggable headerimage" style="position: absolute; top: <?php echo $profile->profileheaderposition; ?>px;" src="<?php echo $profile->profileheader; ?>" alt="profileheader" width="650" />

正如我所说，几个小时的谷歌搜索没有给出任何结果 - 如果我不保存结果，它会工作得很好，但是哦，好吧......

- 编辑 -

现在我快要哭了 -.- 我已经为此设置了赏金，并提供了帮助我的工具 ain jsfiddle，但我的网页上有一个访客帐户，即：http://www.animize.de http://www.animize.de

在那里，您可以使用用户名：Gast 和 pw Gast 登录页面 - 单击名称 (gast) 的右上角，您将看到个人资料 - 在那里您可以移动标题图片 - 当然它应该表现良好以另一种方式 - 帮助:(

Try 这把小提琴 http://jsfiddle.net/UAgDA/35/.

我添加了一个 if 语句drag检查图像当前位置并将当前顶部位置设置为的事件ui.position.top如果条件返回 true，则可拖动事件在触及 div 边界时不会增加或减少顶部位置。这样您就可以保留 div 的位置属性。