平滑滚动

用法

增强类似于锚点跳转到某位置,动画渐渐跳转效果。

去顶部 去底部

                                
                                    <a href="#top" data-toggle="smooth-scroll" class="btn default small-btn">去顶部</a>
                                    
<a href="#bottom" data-toggle="smooth-scroll" class="btn default small-btn">去底部</a>

偏移

设置偏移offset让滚动条滚动到离目标位置一定距离。

偏移

                                
                                    <a href="#offset" class="btn default small-btn" data-offset="-20" data-toggle="smooth-scroll">偏移</a>
                                
                            

事件监听

为元素添加 done.ui.smoothscroll或者JS调用配置complete 来监听滚动完成事件。

参数配置

属性 默认值 描述
duration 500 动画时间
transition easeOutExpo 动画类型名称
offset 0 偏移位置
complete function(){} 完成回调
  $('#j-offset').on('done.ui.smoothscroll', function(){
                                alert('到达offset偏移');
                                })