Advertisements
Offline
kuku
Posts: 2
Joined: Thu May 14, 2009 8:13 pm
Hi,

I hope someone here can point me into the right direction. I worked on this for weeks and can't find a solution.
I created span boxes which can be filled by dropping words on them. However two things are very bothersome for the user, first the words are sticking to the mouse in Firefox (works fine in Safari). So when a person lets go of the word over a box it doesn't snap to the point, but follows the mouse. It works if the user double clicks. which is very odd. (I included the code used below). Secondly, I would like to only allow the user to drop one item in each box, but I couldn't figure how to. If I change the id or class onUpdate they cannot remove the item at all from the box. I want to give them the ability to change boxes after they made their selection.

I know this sounds complicated. So here is the code if necessary I can provide an example online.


Code: Select all
<div id="page">
   <div class="ex_instr">
       <span id="wordbank" class="section1" >
             <span id="item_1" class="lineitem">One</span>
             <span id="item_2" class="lineitem">Two</span>
             <span id="item_3" class="lineitem">Three</span>
        </span>
   </div>

<table cellpadding="0" cellspacing="0" class="ex_opt">
    <tr>
        <td>
        <p class="dr_par">
        <span id="blank_1" class="section" title="Everything">&nbsp;</span>   
        <span id="blank_2" class="section" title="And">&nbsp;</span>
        <span id="blank_3" class="section" title="That">&nbsp;</span>
        </p>
        </td>
    </tr>
</table>
</div> <!--end div id page-->


<script type="text/javascript" language="javascript">

Sortable.create('wordbank',{tag:'span', dropOnEmpty: true, constraint:true, containment: sections, only:'lineitem'});
Sortable.create('blank_1',{tag:'span',dropOnEmpty: true, constraint:true, containment:sections, only:'lineitem', onUpdate:function(el){changeClass(el);}});
Sortable.create('blank_2',{tag:'span',dropOnEmpty: true, constraint:true, containment:sections, only:'lineitem', onUpdate:function(el){changeClass(el);}});
Sortable.create('blank_3',{tag:'span',dropOnEmpty: true, constraint:true, containment:sections, only:'lineitem', onUpdate:function(el){changeClass(el);}});
Sortable.create('page',{tag:'div',only:'section',handle:'ex_instr'});
</script>

ยป

Postby kuku » Sun May 17, 2009 1:55 am

Offline
kuku
Posts: 2
Joined: Thu May 14, 2009 8:13 pm
Nobody?