Question

我有2个自举按钮，我需要能够向下滚动页面。一个进入一个部分，另一个进入页面下方的一个部分。我需要将哪些内容添加到<button>元素中？

<ul>
  <div class="row">
    <div class="col-md-4">
      <li><button class="btn btn-block" style="margin-top: 5px;">Section1</button></li>
    </div>
    <div class="col-md-4">
      <li><button class="btn btn-block" style="margin-top: 5px;">Section2</button></li>
    </div>
  </div>
</ul>

我根本不懂Javascript，而且我对jQuery的经验很少。

Answer 1

这可以用html完成。首先，将您的<button>代码更改为<a>代码

使用<a>标记，您可以将href属性指定为要滚动到的div（或任何元素）。所以说你有一个元素：

<div id="scroll-target"></div>

您可以将代码重写为：

    <ul>
    <div class="row">
      <div class="col-md-4">
    <li><a href="#scroll-target" class="btn btn-block" style="margin-top: 5px;">Section1</button> </li>
      </div>
      <div class="col-md-4">
    <li><a href="#scroll-target" class="btn btn-block" style="margin-top: 5px;">Section2</button> </li>
        </div<
    </ul>

点击按钮会转到#scroll-target div。

另外，我相当确定引导样式在<a>标记上的效果与在<button>标记上具有相同类别（＆＃39; btn＆＃39; ，＆＃39; btn-sm＆＃39;，＆＃39; btn-primary＆＃39;等。）

使用Bootstrap按钮滚动到不同的区域

1 个答案: