Effect.Morph zIndex style not working

[The Dark Lord]

I have gone through the code and i cannot figure out why the zIndex
property is not being recognized.

Here is the copy of the script from scriptaculous

String.prototype.parseStyle = function(){
var style, styleRules = $H();
if (Prototype.Browser.WebKit)
style = new Element('div',{style:this}).style;
else {
String.__parseStyleElement.innerHTML = '<div style=" ' + this +
'"></div>';
style = String.__parseStyleElement.childNodes[0].style;
alert(this); // This shows the style string

}

Element.CSS_PROPERTIES.each(function(property){
alert('Propery = '+property+' And style value =
'+style[property]);
if (style[property]) styleRules.set(property, style[property]);
});

if (Prototype.Browser.IE && this.include('opacity'))
styleRules.set('opacity', this.match(/opacity:\s*((?:0|1)?(?:\.
\d*)?)/)[1]);

return styleRules;
};

when I do an alert on "this" it shows my new width, height and zIndex
of my element but in the each loop when i alert it, the zIndex does
not have a property. It is getting lost somewhere in the script. The
following script is where i'm calling the morph.

if ( $event[$day] != '' )
{
$showIt = ' onMouseOver="new Effect.Morph(this, {style:\'zIndex:
100;\', duration: 0.3});" onMouseOut="new Effect.Morph(this,{style:
\'zIndex: 1; width: 104px; height: 95px; top: 0;\', duration:
0.3});"';
$showEvent = '<div class="event"'.$showIt.'>'.$func-
>decode_html(nl2br($event[$day])).'</div>';
$showEventColor = ' eventColor';
}

The reason i need to change the z-index of the element is that the
text from the next box is showing through my div element. so i need to
keep it hidden behind my current div.

You can check out what i'm working on at http://generationranch.com/sites/vfw/?p=calendar
when you mouseover one of the days that has an event it is supposed to
morph to a larger div which it does... but the day next to it shows
it's text through my enlarged div... I hope someone can follow what
i'm saying...

Now if someone has a better way of doing this i would greatly
appreciate pointing me in the proper direction

Thanks for your time
Chris Cavalier

[Victor]

I see in Firefox 3.6 that z-index is not changed at all.

[shubhojoy]

I don't know if this will help, but whenever I want to place any
element (div) on the top, I frequently obtain the current topmost
value of zindex and then add 1 to it.

currentMaxzIndex = $$("div").invoke("getStyle", "zIndex").max();
newTopmostzIndex = parseInt(currentMaxzIndex) + 1;
console.log(currentMaxzIndex + ", " + newTopmostzIndex);

On your page, I got values (2, 3). Apply newTopmostzIndex to the layer
before it morphs and it should work.


On Jul 28, 7:36 am, The Dark Lord <the_dark_lord12...@yahoo.com>
wrote:

> You can check out what i'm working on athttp://generationranch.com/sites/vfw/?p=calendar