:) I can't get the position ot objects relative to it's container. I get only the position on whole page.Here is my code:
<style>
.draggable { width: 150px; height: 0px; cursor:move; bottom: border:solid; border-color:#000; }
<?PHP if($userinfo->use_colors != '0'): ?>
#container { width: 450px; height:80px; background-color:<?=$userinfo->background?>; }
<?PHP else: ?>
#container { width: 450px; height:80px; background:url(/backgrounds/<?=$userinfo->image?>); }
<?PHP endif; ?>
</style>
<script>
$(function() {
$( "#draggable" ).draggable({ cursor: "move",containment: "#container", scroll: false,
drag: function() {
var position = $(this).position();
var xPos = $(this).position().left;
var yPos = $(this).position().top;
$(this).text('x: ' + xPos + 'y: ' + yPos);
}
});
$( "#draggable2" ).draggable({ cursor: "move",containment: "#container", scroll: false });
$( "#draggable3" ).draggable({ cursor: "move",containment: "#container", scroll: false });
$( "#draggable4" ).draggable({ cursor: "move",containment: "#container", scroll: false });
});
</script>
<div id="container">
<div id="draggable" class="draggable" style="position:relative;top:0px;left:80px;">
.::[ NowPlaying SIGnature ]::.
</div>
<div id="draggable2" class="draggable" style="position:relative;top:20px;left:80px;">
Artist - title
</div>
<div id="draggable3" class="draggable" style="position:relative;top:40px;left:80px;">
Album: (Year)
</div&开发者_开发知识库gt;
<div id="draggable4" class="draggable" style="position:relative;top:60px;left:80px;">
Genre:
</div>
</div>
Try
var xPos = $(this).css('left');
var yPos = $(this).css('top');
...instead.
精彩评论