我目前正在使用拖放脚本并保存(位置:相对)div(s)的左侧和顶部坐标。我的问题是,当我重新加载时,保存它们的坐标并不总是相同的位置(如放置)。
div 位于具有给定高度和宽度的容器内(此容器限制 div 仅在其中移动 - 周边 div)
所以我试图让坐标只在 DIV 内工作/空间,而不是整个页面。
我正在使用 PHP 为该页面获取正确的 div/小部件,该页面提供小部件类(背景和其他基于 css 的变量)
所有小部件都有一个自定义 ID,以防有多个特定小部件
这是我的主要代码:
<?
$load = mysql_query("SELECT * FROM `widgets` WHERE `page`='1' AND `show`='yes'")or die(mysql_error());
while($widget = mysql_fetch_array($load)){
?>
<div id="<? echo $widget['id']; ?>" style="left: <? echo $widget['left']; ?>px; top: <? echo $widget['top']; ?>px;" class="<? echo $widget['widgetid']; ?> draggable ui-widget-content" onmouseup="find('<? echo $widget['id']; ?>','1')"> </div>
<? } ?>
这是我用于保存的 Javascript:
function find(id, page){
var position = $("#"+id).position();
$.ajax({
type: "POST",
url: "save.php",
data: "l=" + position.left + "&t=" + position.top + "&request=" + page + "&w=" +id,
success: function(msg){
var element = document.getElementById(id);
element.style.opacity = "1.0";
}
});
}
l 是左边,t 是顶部,都发送 onmouseup (w = widgetid, request = pageid)
变量正在保存到数据库中,只是没有正确放置在页面上(向右移动很远或稍微向上移动)
任何帮助将不胜感激!
先感谢您