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. ZZH与计数（矩阵加速，动态规划，记忆化搜索）

    题面 因为出题人水平很高,所以这场比赛的题水平都很高. ZZH 喜欢计数. ZZH 有很多的数,经过统计,ZZH一共有 v 0 v_0 v0​ 个 0 , v 1 v_1 v1​ 个 1,-, v 2 ...

  2. Python入门系列（三）一学就会-基础数据类型

    数据类型 您可以使用type()函数获取任何对象的数据类型. x = 5 print(type(x)) 数字类型 x = 1 # int y = 2.8 # float z = 1j # comple ...

  3. 长篇图解etcd核心应用场景及编码实战

    大家好啊,我是字母哥,今天写一篇关于etcd的文章,其实网上也有很多关于etcd的介绍,我就简明扼要,总结提炼,期望大家通过这一篇文章掌握etcd的核心知识以及编码技能! 本文首先用大白话给大家介绍一 ...

  4. Taurus.MVC-Java 版本打包上传到Maven中央仓库（详细过程）：3、Maven独立插件安装与settings.xml配置

    文章目录: Taurus.MVC-Java 版本打包上传到Maven中央仓库(详细过程):1.JIRA账号注册 Taurus.MVC-Java 版本打包上传到Maven中央仓库(详细过程):2.PGP ...

  5. 我的Go gRPC之旅、01 初识gRPC，感受gRPC的强大魅力

    微服务架构 微服务是一种开发软件的架构和组织方法,其中软件由通过明确定义的API 进行通信的小型独立服务组成. 这些服务由各个小型独立团队负责. 微服务架构使应用程序更易于扩展和更快地开发,从而加速创 ...

  6. 第六章：Django 综合篇 - 19：部署 Django

    补充说明:关于项目部署,历来是开发和运维人员的痛点.造成部署困难的主要原因之一是大家的Linux环境不同,这包括发行版.解释器.插件.运行库.配置.版本级别等等太多太多的细节.因此,一个成功的部署案例 ...

  7. 使用Metricbeat监控zookeeper遇到的问题

    1.metricbeat中启动自动加载模块 metricbeat.config.modules: path: ${path.config}/modules.d/*.yml reload.enabled ...

  8. Kibana：Canvas入门

  9. 开启tcp_timestamps和tcp_tw_recycle造成NAT转发连接不上

    文章转载自:https://segmentfault.com/a/1190000022264813

  10. Spring让人眼前一亮的11个小技巧

    前言 我们一说到spring,可能第一个想到的是 IOC(控制反转) 和 AOP(面向切面编程). 没错,它们是spring的基石,得益于它们的优秀设计,使得spring能够从众多优秀框架中脱颖而出. ...