如何使用**Fullpage.js**将fullpage.js分成两部分(div)，并只在右侧(Div)开启**滚动**？

Question

这是超文本标记语言，网页的分区是有效的！我需要在第二个div上添加更多的内容，并使它能够滚动时，我这样做。

<section class="vertical-scrolling" id="section">
<div id="abt">
      <div id="about" >
          <h3>about</h3>
      </div>
      <div id="abouttxt">
         content with scrolling
      </div>
</div>
</section>

下面是CSS：

#about {
height: relative;
    float: left;
}
#abouttxt {
    float: right;
    width: 50%;
    text-align: left;
    text-align: justify;
    text-justify: inter-word;
} 

Answer 1

HTML：

 <div class="section">
        <div class="leftSide">
            <div class="box">Whatever</div>
        </div>
        <div class="rightSide">
            <div class="box">Whatever</div>
            <div class="box">Whatever</div>
            <div class="box">Whatever</div>
        </div>
</div>

CSS：

.leftSide{
    float: left;
    width: 50%;
    background: blue;
    height: 100%;
}
.rightSide{
    float: left;
    width: 50%;
    background: red;
    height: 100%;
    overflow: scroll;
}

然后您必须使用fullpage.js的选项normalScrollElements：

$('#fullpage').fullpage({
    sectionsColor: ['yellow', 'orange', '#C0C0C0', '#ADD8E6'],
    normalScrollElements: '.rightSide'
});

Demo online

Answer 2

HTML：

<div id="content">
<div id="left"></div>
<div id="right"></div>
</div>

CSS：

#content, html, body {
height: 98%;
}

#left {
    float: left;
    width: 50%;
    background: red;
    height: 100%;
    overflow: scroll;
}

#right {
    float: left;
    width: 50%;
    background: blue;
    height: 100%;
    overflow: scroll;
}