Blog Has Moved

Tuesday, July 28, 2009

Since migrating my site to Drupal I now no longer use Blogger and hence my blog has moved here.

Get the Next Highest zIndex in Javascript

Sunday, July 22, 2007

Flash developers have the pleasure of having a nice little built-in method called getNextHighestDepth. Which returns the next highest layer number for any object they call it on. Which is very useful to make sure that what you want to be on top is indeed on top.

function getNextHighestZindex(obj){
   var highestIndex = 0;
   var currentIndex = 0;
   var elArray = Array();
   if(obj){ elArray = obj.getElementsByTagName('*'); }else{ elArray = document.getElementsByTagName('*'); }
   for(var i=0; i < elArray.length; i++){
      if (elArray[i].currentStyle){
         currentIndex = parseFloat(elArray[i].currentStyle['zIndex']);
      }else if(window.getComputedStyle){
         currentIndex = parseFloat(document.defaultView.getComputedStyle(elArray[i],null).getPropertyValue('z-index'));
      }
      if(!isNaN(currentIndex) && currentIndex > highestIndex){ highestIndex = currentIndex; }
   }
   return(highestIndex+1);
}

So far I have test it on Firefox, IE6, IE7, Opera, and Safari in XP. Also I have tested it on Firefox and Safari on OSX. It works perfectly in all but Safari on OSX (10.4). So if you are are a javascript developer and know how to adjust this function to work on Safari on a Mac please leave a comment :)

Labels: javascript, z-index

| | posted by Jason J. Jaeger  |  5 comments