CSS Scroll-behavior支援度:Can I Use)
以往JS才能控制scroll,現在css也能輕鬆調整scroll行為了!
以下為範例:
template
<div id="app">
<div class="btn_container">
<a href="#section_A">A</a>
<a href="#section_B">B</a>
<a href="#section_C">C</a>
</div>
<div class="scroll_container">
<section id="section_A">A</section>
<section id="section_B">B</section>
<section id="section_C">C</section>
</div>
</div>
style
...
.scroll_container{
width:200px;
height:200px;
overflow-y: scroll;
scroll-behavior: smooth;
}
...
IT15-Day19-CSS scroll behavior