当滚动时，如何将图像粘贴到div的左侧？

Question

目前，我正在建立一个个人网站，并且有一个关于我的部分。 “关于我”部分包含很多文本，我希望将图像放置在div的左侧（包含所有文本）。

当您滚动文本时，我希望图像紧随其后，以便您在向下滚动div时可以看到它。 这意味着随着滚动的发生，图像正在移动（向下推动）。 你会怎么做？

让事情变得更加复杂的是，我在div中有一个ap，它是隐藏的，并使用jquery进行了开关。 这会增加原始div的高度。

HTML：

<section id="about" class="container content-section">
    <div class="row">
        <div class="col-xs-6 col-md-4">
            <img src="img/pic.jpeg" height="300" width="300" class="bio-pic" style="display:inline">
        </div>
        <div class="col-xs-12 col-sm-6 col-md-8" style="display:inline; ">
            <h2>About Me</h2>
            <h4>the present</h4>
            <p>Hi! I'm Ashley.</p>
            <h4 class="thepast">the past <i class="fa fa-angle-down"></i></h4>
            <p class="thepasttext">text of about ~300 words or more</p>
            <h4>the future</h4>
            <p>small blurb of text</p>
        </div>
    </div>
</section>

CSS：

.thepasttext {
    display: none;
}

jQuery的：

$(document).ready(function(){
    $('.thepast').click(function(){
        $('.thepasttext').toggle();
    });
});

Answer 1

您应该尝试在CSS中添加

position: fixed;

到您的div与img。