滚动侦测 ,让右下角的内容在页面最上方不显示 , 随鼠标下滑而显示

下载插件

下载后把图中两个js文件引入自己的项目中

然后在组件中引入这个js

在mounted的钩子函数中添加这部分内容

// 滚动侦测
      var waypoint = new Waypoint({
        element: document.getElementById('waypoint'), // 这里代表检测的什么标签
        handler: function(direction) {
          if (direction == "down"){ // 滚动触发这个函数
            //如果向下滑动鼠标 , 则让id 为 toolbar的标签显示
            $('#toolbar').show(500);
          }else {
            //如果向上滑动鼠标 , 则让id 为 toolbar的标签隔500毫秒后隐藏
            $('#toolbar').hide(500);
          }
          console.log('Scrolled to waypoint!' + direction)
        }
      })

效果就是
滑到顶部下图的内容消失
鼠标向下滑动 , 图中的内容会再次出现