DIV调整与jQuery

我正在使用HTML，CSS，angularJs和jQuery的程序问题。我没有受过jQuery培训，也没有角色，所以我正在学习。DIV调整与jQuery

的想法是有不同的屏幕上移动浏览器和用户将能够在那里，他想，所以我用http://jqueryui.com/draggable/移动它们。

，但我有一个问题，我无法找到如何解决。一旦你在DIV添加内容或调整它的其他的div向下移动（他们认为第一个div取决于他们，所以他们向下移动，让他长大），它是没有意义的，因为箱子是不是在这个地方它开始（用户可以将它移动到屏幕上的另一个地方）。

我附上我的代码，你可以看到如何调整您已经移动还是移动的人就可以了项目最初的地方：

HTML：

<html> 
    <head> 
     <title>T1</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <link rel="stylesheet" type="text/css" href="style.css">   
     <link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css"> 

    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>  

    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 

    <script src="angularJs/angularScripts.js"></script> 
    <script src="JQuery/"></script> 

</head> 
<body ng-app="myApp" > 


    <div class="program" ng-controller="program"> 
     <button class="buttonAddItem" ng-click="addItem();"> 
      item + 
     </button> 


     <!-- items --> 
     <div class="item" ng-repeat="item in items" > 
      <div > 
       {{item.name}} 
      </div> 
     </div> 


    </div> 
    <script> 
     //mover las ventanas 
     $(function() { 
      $(".item").draggable(); 
     }); 
     //cambiar el tamano de las ventanas 
     $(function() { 
      $(".item").resizable(); 
     }); 

    </script> 
</body>

角：

var app = angular.module('myApp', []); 

app.controller('program', function ($scope) { 

$scope.items = []; 

$scope.items[0] = {name: "name1"}; 
$scope.items[1] = {name: "name2"}; 
$scope.items[2] = {name: "name3"}; 
$scope.items[3] = {name: "name4"}; 

$scope.addItem = function ($event) { 

    var newItem = {name: "newItem"}; 

    $scope.items.push(newItem); 
}; 

$scope.removeMethod = function (id) { 

    removeItem($scope.methods, "id", id); 
}; 

var removeItem = function (object, key, value) { 
    if (value === undefined) 
     return; 

    for (var i in object) { 
     if (object[i][key] === value) { 
      object.splice(i, 1); 
     } 
    } 
}; 

var getItem = function (object, key, value) { 

    if (value === undefined) 
     return; 

    for (var i in object) { 
     if (object[i][key] === value) { 
      return object[i]; 
     } 
    } 
};

}）;

CSS：

.item{ 
    border: solid; 
    width: 30%; 
}

你能说我如何解决它吗？

来源

2016-07-22 David Marciel

添加position: absolute你的CSS和调整后的箱子不会下移。我只会建议添加一些默认定位（例如，顶部为&），如果没有它，它们将在页面加载时显示在另一个上。

来源

2016-07-22 10:55:24

对不起，但它不起作用 –

这就是我使用jsfiddle测试它的方法：https：//jsfiddle.net/jcd4j47b/ 这不是你期望的吗？你能否澄清一下你所期望的不工作？ –

它在jsFiddle中不起作用，角度不能正常工作。你必须在tomcat服务器的本地机器上使用它。 –

DIV调整与jQuery

回答

相关问题