I have a simple setup.
This is my CSS:
<style type="text/css">
.white-back
{
background-color:#FFFFFF;
}
</style>
This is the jquery/jquery-ui stuff:
<script type="text/javascript">
$(function() {
$("#sortable").sortable();
$("#sortable").disableSelection();
$("#draggable > li").draggable({
revert: true,
helper: 'clone'
});
$("#droppable1, #droppable2").droppable({
hoverClass: "white-back",
drop: function(event, ui){
alert("Got here");
}
});
});
</script>
And here is the HTML:
<ul id="sortable" style="border:thin black solid; float:left; width:
200px; height:100px; margin:0; padding:2px; list-style-type:none;">
<li>Item for sort 1</li>
<li>Item for sort 2</li>
</ul>
<button id="droppable1" style="float:left; margin-left:20px;">Bob</
button>
<br style="clear:both;"/>
<br/>
<ul id="draggable" style="border:thin black solid; float:left; width:
200px; height:100px; margin:0; padding:2px; list-style-type:none;">
<li>Item for drag 1</li>
<li>Item for drag 2</li>
</ul>
<button id="droppable2" style="float:left;margin-left:20px;">Bob</
button>
Now, the trick. If you grab one of the sortables, drag it toward the
droppable (the Bob button) and note when the button turns white, and
then grab one of the draggables and do the same thing you will note
the droppable turns white (is ready to accept) in a much different
place.
I have figured out why (and you will too if you put a border around
your LI elements). But I would like to know how to get the sortables
to do what the draggables do (in terms of where/when the droppable
will accept them).
Any thoughts?
Thanks in advance.
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
