Checking if a node had been resized

Whilst working with the Drag and Drop plugin for YUI, I discovered an odd quirk between IE8- and FF3.6 . With the height of a UL set to 200px in the style sheet, IE would automatically expand and contract the UL to fit any overflowing LI elements however FF would follow the standard overflow and place the LI elements outside the parent UL.

To compensate for this I simply took the top+height of the last LI in the UL and checked that against the top+height of the UL, increasing the height when needed. Simple enough so far, the problem came when I wanted to clear the height adjustment I first had to find out if an adjustment had been made. Luckily YUI uses the inline style to change an elements height so all that was needed was a check on the style attribute and see if it contains anything.

var ul ='#'+sdid); //Get the target element
if(ul){ //Safety check
 if(ul.getAttribute('style') != '') //Check for inline styling
 ul.setAttribute('style','');  //Inline styling found, clear all inline styling

As an extension to this function I would recommend applying a more precise test and replace on the ul.getAttribute(‘style’) specifically checking for the height style. I will include details on this next step soon.


Leave a Reply