Merhabalar,
Aşağıdaki kod ile div leri hareket ettirebiliyorum. Fakat bu div lerin pozisyonlarını (yani style değerlerini) veritabanına kaydetmem gerekiyor. Bir döngü ile div sayısı kadar gizli text ler oluşturup her div için pozisyonlarını bu text lere yazmak istiyorum. div sayısı veritabanındaki kayıt sayısına göre artıp azalabilir. bu işlemi nasıl yapabilirim.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="jquery-1.7.2.js"></script>
<script src="jquery.event.drag-2.2.js"></script>
</head>
<body>
<script type="text/javascript">
jQuery(function($){
var $div = $('#container');
var z = 1;
$('.drag')
.drag("start",function( ev, dd ){
$( this ).css('zIndex', z++ );
$( this ).addClass("active");
dd.limit = $div.offset();
dd.limit.bottom = dd.limit.top + $div.outerHeight() - $( this ).outerHeight();
dd.limit.right = dd.limit.left + $div.outerWidth() - $( this ).outerWidth();
})
.drag(function( ev, dd ){
$( this ).css({
top: dd.offsetY,
left: dd.offsetX,
top: Math.min( dd.limit.bottom, Math.max( dd.limit.top, dd.offsetY ) ),
left: Math.min( dd.limit.right, Math.max( dd.limit.left, dd.offsetX ) ),
});
})
.drag("end",function(){
$( this ).removeClass("active");
});
});
</script>
<div id="container"></div>
<div class="drag" id="1" style="left:40px;"></div>
<div class="drag" id="2" style="left:120px;"></div>
<div class="drag" id="3" style="left:200px;"></div>
<style type="text/css">
.drag {
position: absolute;
border: 1px solid #89B;
background: #BCE;
height: 58px;
width: 58px;
cursor: move;
top: 120px;
}
#container {
height: 299px;
border: 1px dashed #888;
}
.active {
background-color: #BEE;
border-color: #8BB;
}
</style>
</body>
</html>dosyalar için link:
http://dosya.co/top8ky5vav6p/Yeni_Klasör_(14).rar.html