精简材料设计：mdl-layout__tab-bar和页面滚动

Question

我有一个mdl-layout__tab-bar，在导航栏中有一些链接。 我希望这些链接触发页面滚动到页面的各个部分。

我尝试了以下解决方案：

# the targeted section starts with the <a name="myTargetedSection" id="myTargetedSection"></a> tag
<div class="mdl-layout__tab-bar">
    <a href="#myTargetedSection" class="mdl-layout__tab is-active">My link</a>
    ...
</div>

这行不通，也不行

<div class="mdl-layout__tab-bar">
    <a href="#myTargetedSection" class="mdl-layout__tab" onclick="elmnt = document.getElementById('myTargetedSection'); scrollTo(document.body, elmnt.offsetTop, 600);">My link</a>
    ...
</div>

似乎mdl-layout__tab链接仅适用于mdl-layout__tab-panel元素。 我发现的（令人不满意的）解决方案是使用常规的mdl-navigation__link链接，但是这些链接没有底线，并且不能在小屏幕上水平浏览。

任何想法？ 谢谢！

Answer 1

解决：以下代码有效

<div class="mdl-layout__tab-bar">
    <a href="#myTargetedSection" class="mdl-layout__tab" onclick="elmnt = document.getElementById('myTargetedSection').scrollIntoView();">My link</a>
</div>