當滾動時，如何將圖像粘貼到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。