sorrry z-index added to .person, not to .list
On 14 sep, 09:19, Erwann <erwann.pencre...@ch-chaumont.fr> wrote:
> 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
-~----------~----~----~----~------~----~------~--~---
