jquery: 2d transform (scaling images) plugin and IE

Question

The following snippet works everywhere it needs to except IE7:

//Assess Stage 1
function stage1() {
    $("#prevBtn").hide();

    $('#cs_contentToSlide').animate({
        left:0},200, function() {
    $("#cs_house").fadeTo(10,1);
    $("#cs_social").fadeTo(10,.3);
    $("#cs_pie").fadeTo(10,.3);
    $("#cs_house").animate({scale: '1.1'}); 
    $("#cs_house").fadeTo(10,1);
    $("#stateGraphic").attr('src', 'images/state1_3stage.gif');

})};

I am using the 2d transform plugin to actually scale the image itself, from the center-point of the image which looks much nicer than the top left default.

The issue is that the placement of the images that get scaled do not stay in place. If I comment out this line: $("#cs_house").animate({scale: '1.1'}); then the css works.

I've set the position of absolute and the top/left values in the css but also tried in this function using: $("#cs_house").css({'top':'36','left':'230'}); which, if I remove the scaling line, works as it should in IE.

My question is: Does anybody know how to make IE7+ keep an element/image in place when using the scale effect?

Answer 1

UPDATE: 1. Need to use jquery 1.4.2 and the biggie... 2. wrap item, in this case an image, in a div and position the div/container instead. Golden.