javascript - 当我改变我的移动 View 时我的图像的位置

Question

我的图像位置有一个小问题，所以这就是问题所在，我有我的纵向 View ，我滑动我的图像，当我切换我的 View (纵向到横向)时，我的图像不再居中。我的问题是我的图像边距仍然与纵向 View 相同，我不知道如何更改它。

我已经尝试更改我的图像边距，但无济于事，它仍然占用我使用的第一个 View 边距。

所以这里是Js/Jq:

function puceTransition(front) {
    var wrapImg = $('.wrapImage');
    var margeLeft = 0;

if(front) {
    if (stateImg == "back") {
        stateImg = "front";

        margeLeft = $('#myImageBack').css("marginLeft").replace("px", "");

        $('#frontImg').addClass('select');
        $('#backImg').removeClass('select');

        $('#myImageBack').animate({opacity: "0.5", marginLeft: ((imgFront + widthImg1 + myButtonRight)) + "px"}, "normal");
        $('#myImageFront').animate({opacity: "1.0", marginLeft: parseInt(margeLeft) + "px"}, "normal");

        $('.imgTitleBack').hide();
        $('.imgTitleFront').show();

        $('#imgButtonLeft').animate({opacity: "0.5"});
        $('#imgButtonRight').animate({opacity: "1.0"});
    }
} else {
    if (stateImg == "front") {
        stateImg = "back";

        margeLeft = $('#myImageFront').css("marginLeft").replace("px", "");

        $('#backImg').addClass('select');
        $('#frontImg').removeClass('select');

        $('#myImageFront').animate({opacity: "0.5", marginLeft: (((-imgFront) + (-widthImg1) + myButtonLeft)) + "px"}, "normal");
        $('#myImageBack').animate({opacity: "1.0", marginLeft: parseInt(margeLeft) + "px"}, "normal");

        $('.imgTitleBack').show();
        $('.imgTitleFront').hide();

        $('#imgButtonLeft').animate({opacity: "1.0"});
        $('#imgButtonRight').animate({opacity: "0.5"});
    }
}
}

这是CSS:

    .myImage { display: block; position: relative; width: 450px; margin: 0 auto; }
    .myImage.second { margin: -240px 0 0 670px; }
    .myImageAirport { display: block; position: relative; width: 450px; margin: 0 auto; }
    .myImageAirport.second { margin : -220px 0 0 670px; }

Answer 1

只需将此 css 添加到您的图像类中

.myImage {
display: block;
margin-right: auto;
margin-left: auto;
}

它应该有效!