Hey,
I have a series of elements that are all set in the CSS to 120px in
width - here's the CSS:
li{ height: 20px; margin: 2px 0; -moz-border-radius: 3px; position:
relative; -webkit-border-radius: 3px; width: 120px; }
My jQuery animates these elements' widths to different sizes. The
following is within a loop that goes through each element and uses
corresponding values in an array to determine their widths (that's
elementSize). 'time' is set by another function.
$('#graph #item-' + i).animate({width:elementSize+"px"},time,function()
{
$('.value',this).fadeIn(700);
$(this).fadeTo(200,55);
});
This works perfectly in Firefox, however in Safari things work in
reverse - the elements start at 100% of the page's width and shrink to
their proper widths as determined by that array. It is even ignoring a
500px wide wrapper that contains all of the elements. It seems Safari
doesn't like working from the predetermined value of 120px width. The
same behavior exists if I remove the variable - "{width:"300px"}".
Any ideas? Your input is appreciated!
Thanks in advance for any words.
