animate() using variables

animate() using variables

Is it possible to use animate() using variables? My code is sound but when I try to replace the CSS value with a variable, it suddenly won't work in IE7.

//First, here's the code that works in all 3 browsers: FF, Chrome, and IE7
$('#btn').click(function(){
          //no problem here
          $('#otherdiv').animate({height:200}, 'slow');
});

//This is where it begins
//Won't work in IE7 when using a variable
$('#btn').click(function(){
          //uh, oh
          var i = $('#mydiv').css('height'); //returns '200px'
          $('#otherdiv').animate({height:i}, 'slow');
});

//This won't either (in IE again)
$('#btn').click(function(){
          var i = $('#mydiv').css('height'); //returns '200px'
          $('#otherdiv').animate({'height':i}, 'slow');
});


//So does this
$('#btn').click(function(){
          var i = $('#mydiv').css('height'); //returns 200px
          i = i.slice(0, -2); //returns '200'
          $('#otherdiv').animate({height:i}, 'slow');
});


Could it be a bug?