export function processScroll (_this) {
  let _self = _this
  let scrollbarEl = _this.$parent.wrap
  scrollbarEl.onscroll = function() {
    if(scrollbarEl.scrollTop > 170) {
      _self.prostyle = {
        position: 'fixed',
        width: '100%',
        maxWidth: '810px',
        top: 0
      }
    } else {
      _self.prostyle = {
        
      }
    }
  }
}
 
在监测滚动的位置时候 做样式的修改

el-scrollbar 监测滚动条的更多相关文章

  1. vue 中监测滚动条加载数据（懒加载数据）

    vue 中监测滚动条加载数据(懒加载数据) 1:钩子函数监听滚动事件: mounted () { this.$nextTick(function () { window.addEventListene ...

  2. [C#] （原创）一步一步教你自定义控件——02，ScrollBar（滚动条）

    一.前言 技术没有先进与落后,只有合适与不合适. 本篇的自定义控件是:滚动条(ScollBar). 我们可以在网上看到很多自定义的滚动条控件,它们大都是使用UserControl去做,即至少使用一个P ...

  3. Scrollbar中滚动条的设置

      insideOverlay 默认值,表示在padding区域内并且覆盖在view上 insideInset 表示在padding区域内并且插入在view后面 outsideOverlay 表示在p ...

  4. js监测滚动条到达最底边

    scroll : function(){ $(window).scroll(function () { var scrollTop = $(this).scrollTop(); var scrollH ...

  5. JS模拟滚动条(有demo和源码下载,支持拖动 滚轮 点击事件)

    由于游览器自带的滚动条在美观方面并不是很好看,所以很多设计师希望通过自己设计出来的滚动条来做这样的效果,JS模拟滚动条其实很早看到jQuery有这样的插件或者KISSY有这样的组件,一直想着自己什么时 ...

  6. svelte组件：svelte3.x自定义美化虚拟滚动条组件svelte-scrollbar

    基于svelte3.0自定义pc端虚拟滚动条组件svelteScrollbar. svelte-scrollbar:运用svelte3.x创建的桌面pc版自定义美化滚动条组件.支持是否原生滚动条.自动 ...

  7. Tkinter教程之Scrollbar篇

    本文转载自:http://blog.csdn.net/jcodeer/article/details/1811319 '''Tkinter教程之Scrollbar篇'''#Scrollbar(滚动条) ...

  8. js原生封装自定义滚动条

    /* * @Author: dothin前端 * @Date: 2015-11-21 00:12:15 * @Last Modified by: dothin前端 * @Last Modified t ...

  9. Unity UGUI基础之Slider、Scrollbar

    Slider(滑动条):是一个主要用于形象的拖动以改变目标值的控件,他的最恰当应用是用来改变一个数值,最大值和最小值自定义,拖动滑块可在此之间改变,例如改变声音大小. Scrollbar(滚动条):是 ...

随机推荐

  1. Linux有趣命令

    通外网 下载使用阿里云镜像源:wget -O /etc/yum.repos.d/CentOS-Base.repo https://mirrors.aliyun.com/repo/Centos-7.re ...

  2. KingbaseES 与Oracle 函数稳定性对于性能影响差异比较

    一.函数的属性 KingbaseES 函数在定义时有三种稳定性级别:volatile.stable 和 immutable.默认情况下,创建函数的稳定性为volatile.以下是这三种函数的区别: V ...

  3. this的指向问题、bind/call/apply改变this指向

    this的指向问题 全局作用域下的this指向 无论是否是严格模式,全局作用域下的this始终指向window 函数内部的this 严格模式下: function test() { 'use stri ...

  4. 2021年3月-第02阶段-前端基础-Flex 伸缩布局-移动WEB开发_flex布局

    移动web开发--flex布局 1.0 传统布局和flex布局对比 1.1 传统布局 兼容性好 布局繁琐 局限性,不能再移动端很好的布局 1.2 flex布局 操作方便,布局极其简单,移动端使用比较广 ...

  5. Kubernetes容器运行时弃用Docker转型Containerd

    文章转载自:https://i4t.com/5435.html Kubernetes社区在2020年7月份发布的版本中已经开始了dockershim的移除计划,在1.20版本中将内置的dockersh ...

  6. Prometheus使用nginx 设置二级路径反向代理

    1.nginx 设置 location /promethues/ { proxy_pass http://10.xx.xxx.55:9090/prometheus/; } 2.设置prometheus ...

  7. nginx实现vue的web页面项目集群负载

    问题描述 项目是使用前后端分离,前端使用的是vue技术. 想实现的功能是:在前端项目部署的过程中(直接删除项目目录的文件,然后上传新的项目文件),在这个短时间内不能影响用户的使用.所以想到的就是使用n ...

  8. MySQL数据表更新模板

    -- ---------------------------- -- 新增表 -- ---------------------------- CREATE TABLE `biz_circle_lead ...

  9. 关于Loki中promtail组件收集日志的几点思考

    promtail组件是采用docker方式运行的,配置文件也是在docker容器中,宿主机中没有挂载点,这就有问题了. 宿主机中没有挂载配置文件,也就没法修改,登录promtail的docker容器中 ...

  10. 2_爬豆瓣电影_ajax动态加载

    爬豆瓣 什么是 AJAX ? AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = Asynchronous JavaScript and XML(AJAX = 异步 ...