Question

目前，我正在创建一个个人网站，而且我有一个关于我的部分。关于我的部分有很多文本，我希望图像位于div的左侧（包含所有文本）。

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

为了使事情变得更复杂，我在div中隐藏了一个p，并用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;

用img。

到你的div

当你滚动时，你如何将图像粘贴到div的左侧，它会与div一起移动？

1 个答案: