使用jQuery在div中淡化会导致内容宽度大于Mobile Safari上的视口

Question

点击按钮时，我正在使用jQuery淡化div。 在网站褪色之前，网站会根据需要进行渲染。

但是当我点击按钮并且div被淡入时，网站的大小会以某种方式增加，我可以横向移动。如果我不隐藏和淡入相同的div，就不会发生这种情况。

JS

$("#stopp").click(function()
    {   
        $("#pil").removeClass("rotatePil");

        getRotationDegrees(hjul);

        $("html, body").animate({ scrollTop: $("#third").offset().top}, 1500);
        //$("html, body").animate({ scrollTop: $(document).height() }, 1500);

        $("#hvit-boks>h1").fadeOut(500);
        $("#start,#stopp").fadeOut(500);

        setTimeout(function()
        {
            $("#res").fadeIn(1000);
        }, 500);

        setTimeOut(function()
        {
            $("html, body").stop();
        }, 1500);

    });

HTML     

                <h1>Snurr lykkehjulet!</h1>

                <button id="start">SNURR!</button>

                <button id="stopp">STOPP</button>

                <div id="res">

                    <span id="big-res">Du fikk 145</span>

                    <p>

                        Et lykkehjul er tilfeldig. Det er imidlertid ikke tilfeldig hva kundene våre synes om skadeoppgjøret vårt. 
                        Faktisk får vi 8,6 i gjennomsnittsscore på en skala fra 0-10 når de blir spurt om hvor fornøyde de er etter en 
                        skade. Det skal vi være stolte av!


                    </p>

                    <button id="again">PRØV IGJEN</button>

                </div> <!-- /RES -->

            </div> <!-- /HVIT BOKS -->

CSS

#hvit-boks
{
    width: 90%;
    padding: 40px 0 40px 0;
    margin: 0 auto 0 auto;
    text-align: center;
}

#hvit-boks h1
{
    font-size: 30px;
}

#left
{
    width: 100%;
    padding: 0;
    margin: 0;
}

#big-res
{
    width: 50%;
    padding: 0;
}

#res p
{
    width: 80%;
    padding: 0 0 30px 0;
}

Answer 1

我不确定我的解决方案是否适用于您的情况。但我希望你尝试以下解决方案。

您可以尝试将以下css添加到您的代码中。

#res
{
    width: 100%;
    overflow:hidden
}

如果有效，请回复我。如果可能的话，我会提出更好的解决方案。