Hi there!
I have a page with several draggable objects (DIVs). Since they are
very likely to overlay, I want the one last dragged to stay on top
(What I want is something like http://www.vonklier.de/). Therefore, I
have a function which changes the z-index of the draggables after each
dragging action. Maybe have a look at it and try the following code in
your browser:
<pre>
<html>
<head>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="scriptaculous.js"></script>
<style type="text/css">
#imgContainer1 {
position:absolute;
top:200;
left:100;
width: 393;
height: 287;
background-color:#AA0000;
}
#imgContainer2 {
position:absolute;
top:100;
left:20;
width: 386;
height: 291;
background-color:#00AA00;
}
#imgContainer3 {
position:absolute;
top:50;
left:200;
width: 389;
height: 293;
background-color:#0000AA;
}
</style>
</head>
<body>
<div id="imgContainer1">one</div>
<div id="imgContainer2">two</div>
<div id="imgContainer3">three</div>
<script type="text/javascript" language="javascript">
function dragObserver() {
dragObserver.prototype.onEnd = function(eventName, draggable,
event) {
var myZIndex = draggable.element.style.zIndex;
var highest = 0;
for (i=0; i<Draggables.drags.length; ++i) {
var thisvalue =
parseInt(Element.getStyle(Draggables.drags[i].element,'z-index'));
if (thisvalue > highest) {
highest = thisvalue;
}
if (thisvalue > myZIndex) {
Draggables.drags[i].element.style.zIndex = thisvalue-1;
}
}
draggable.element.style.zIndex = highest;
alert("Can you imagine life without ME?");
}
}
var ob = new dragObserver();
Draggables.addObserver(ob);
new Draggable('imgContainer1', {zindex:10, starteffect:null,
endeffect:null} );
new Draggable('imgContainer2', {zindex:11, starteffect:null,
endeffect:null} );
new Draggable('imgContainer3', {zindex:12, starteffect:null,
endeffect:null} );
</script>
</body>
</html>
</pre>
I have two questions:
1. Why does this only work in Firefox and not in IE?
2. Why does this cease to work when I delete the silly alert() call?
I'd really appreciate if you could help, I think this is a very common
use case and I just don't get it. Thanks!
Mario
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" 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/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
