[jQuery] animate problem when using ems and ie
Has anyone had a problem animating the left position of an element
when using em units in IE? It works fine in Firefox, but in IE it
seems to reset my container to either it's original position or zero,
not sure which, before running the animation. I would like to leave
the units in ems if at all possible. My javascript is a little rusty,
but here it is:
$(document).ready(function(){
$(".btnScreen").click(function()
{
// force ems
if($(".sectioncontainer").css("left") == '0px')
{
$(".sectioncontainer").css("left",".01em");
}
var elementid = this.id;
var distance = 0;
var objLeft = $(".sectioncontainer").css("left");
var position = objLeft.substr(0,objLeft.length - 2);
// numeric position of section container
position = position - 0;
switch (elementid)
{
case 'art':
distance = (0 + position);
break;
case 'photo':
distance = (60 + position);
break;
case 'ria':
distance = (120 + position);
break;
default:
distance = 0;
break;
}
var d = distance + '';
if(distance > 0)
{
d = '-=' + d;
}
else
{
d = '+=' + d.substr(1,d.length);
}
$(".sectioncontainer").animate({"left": d+'em'}, "slow");
return false;
});
});
TIA for any help.