Sh4wn
Joined: 30 Apr 2007
Posts: 1
|
 Posted: Mon Apr 30, 2007 4:09 pm Post subject: Script.aculo.us Sortable divs problem. |
 |
|
Hi,
I'm using Script.aculo.us for a project, and I'm using the Sortable feature, so the user can reorganise the position of some blocks.
But there's one strange thing:
When I drag a block, to the left, under an other block, I get this:
So far, so good.
But when I move the block a little bit further to the left, still under the other block, I get this:
The other block moves down, and the place marker moves up, while I'm in fact still under the other block.
This is the code of my block:
| Code: |
<div class="block">
<div class="topRound_orange" onmouseover="showElement('control_2', 'inline');" onmouseout="hideElement('control_2');">
<h2 class="headerTitel" style="float: left; cursor: move;">Hotels</h2>
<span style="float: right; display: none;" id="control_2">
<a class="control" style="cursor: pointer;" id="plusmin_2" title="Minimaliseer" onclick="BlindEffect('content_2');">-</a>
<a class="control" style="cursor: pointer;" onclick="delete_block('2');" id="close_2">x</a>
</span>
</div>
<div class="step" id="content_2" style="text-align: left; height: auto; padding-bottom: 5px;">
<ul class="sublist" style="margin-left: 10px; list-style: none;">
<li id="link_6" onmouseover="showElement('link_control_6', 'inline');" onmouseout="hideElement('link_control_6');">
<span style="float: left;">
<a href="http://incase4u.komto.net/link/bekijk/6/">Hof van Gelre</a>
</span>
<span style="float: right; display: none; margin-right: 5px;" id="link_control_6">
<img src="/images/icons/link_delete.png" onclick="delete_link(6);" style="cursor: pointer;" alt="Delete" />
</span>
<br style="clear: both;" />
</li>
</ul>
</div>
<div class="bottomRound"></div>
</div>
|
And this is how I create the sortables:
| Code: |
<script type="text/javascript">
// <![CDATA[
Sortable.create("kolom0",
{tag: 'div', handle: 'headerTitel', only: 'block', overlap: 'horizontal', dropOnEmpty: true, containment: ["kolom0","kolom1","kolom2"], constraint: false});
Sortable.create("kolom1",
{tag: 'div', handle: 'headerTitel', only: 'block', overlap: 'horizontal', dropOnEmpty: true, containment: ["kolom0","kolom1","kolom2"], constraint: false});
Sortable.create("kolom2",
{tag: 'div', handle: 'headerTitel', only: 'block', overlap: 'horizontal', dropOnEmpty: true, containment: ["kolom0","kolom1","kolom2"], constraint: false});
// ]]>
</script>
|
Anyone an idea why dragging is acting so strange? |
|
