Hi, I've found the solution, by adding z-index : 500 to the .list css
class
On Sep 10, 4:12 pm, Erwann <erwann.pencre...@ch-chaumont.fr> wrote:
> Hi,
>
> In the following source code, I might have done something wrong but I
> can't find where.
>
> What is wrong ? try moving boxes from column 1 and 3 in other columns
> then try to move the same box again.
>
> do the same with the column 2 and 4
>
> could you help me to solve that problem please
>
> <html>
> <head>
> <script src="/ressources/scriptaculous/lib/prototype.js" type="text/
> javascript"></script>
> <script src="/ressources/scriptaculous/src/scriptaculous.js"
> type="text/javascript"></script>
>
> <style type='text/css'>
> .list{
> width:200px;
> height:600px;
> border:3px solid navy;
> float:left;
> margin:5px;
> padding:2px;
>
> }
>
> .person{
> height:32px;
> border:thin solid indianred;
> padding:1px 1px 1px 34px;
> margin:1px 0px;
> background-color:lemonchiffon;
> background-image:url("pix/person.png");
> background-position:1px;
> background-repeat:no-repeat;
> cursor:move;
>
> }
>
> </style>
> </head>
> <body>
>
> <div id='liste1a' class='list'>
> <div id='person1' class='person'>User 1</div>
> <div id='person2' class='person'>User 2</div>
> <div id='person3' class='person'>User 3</div>
> </div>
> <div id='liste2a' class='list'>
> <div id='person4' class='person'>User 4</div>
> <div id='person5' class='person'>User 5</div>
> </div>
> <div id='liste3a' class='list'>
> <div id='person6' class='person'>User 6</div>
> <div id='person7' class='person'>User 7</div>
> <div id='person8' class='person'>User 8</div>
> <div id='person9' class='person'>User 9</div>
> </div>
> <div id='listeaway' class='list'>
> <div id='person10' class='person'>User 10</div>
> </div>
>
> <div id='com' style='width:600px;height:200px'>
>
> </div>
> <!-- activation du drag and drop -->
> <script type="text/javascript">
>
> new Draggable('person1', {snap: [220, 37]});
> new Draggable('person2', {snap: [220, 37]});
> new Draggable('person3', {snap: [220, 37]});
> new Draggable('person4', {snap: [220, 37]});
> new Draggable('person5', {snap: [220, 37]});
> new Draggable('person6', {snap: [220, 37]});
> new Draggable('person7', {snap: [220, 37]});
> new Draggable('person8', {snap: [220, 37]});
> new Draggable('person9', {snap: [220, 37]});
> new Draggable('person10', {snap: [220, 37]});
>
> Droppables.add('liste1a', {
> accept: 'person',
> hoverclass: 'hover',
> onDrop: function(who) {
> alert('moved ' + who.innerHTML + ' to liste1a');
> }
> });
>
> Droppables.add('liste2a', {
> accept: 'person',
> hoverclass: 'hover',
> onDrop: function(who) {
> alert('moved ' + who.innerHTML + ' to liste2a');
> }
> });
>
> Droppables.add('liste3a', {
> accept: 'person',
> hoverclass: 'hover',
> onDrop: function(who) {
> alert('moved ' + who.innerHTML + ' to liste3a');
> }
> });
>
> Droppables.add('listeaway', {
> accept: 'person',
> hoverclass: 'hover',
> onDrop: function(who) {
> alert('moved ' + who.innerHTML + ' to listeaway');
> }
> });
>
> </script>
>
> </body>
> </html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
