vue点击返回顶部插件vue-totop
vue-totop

vue 点击返回顶部插件,可以根据参数设定按钮大小,颜色,类型,返回顶部的时间等。github地址:https://github.com/1006008051/vue-totop,欢迎star。

安装
npm install vue-totop -S
使用
注入
// ES6
import vueToTop from 'vue-totop'
//or require
var vueToTop = require('vue-totop')
Vue.use(vueToTop)
组件使用
<vueToTop></vueToTop>
参数
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
| type | 按钮的类型,一共16种 | number | 0~15 | 0 |
| top | 滚动条离顶部多高时,显示返回顶部按钮 | number | 大于0的整数 | 400 |
| right | 按钮右部定位位置 | number | 大于0的整数 | 30 |
| bottom | 按钮底部定位位置 | number | 大于0的整数 | 30 |
| size | 按钮大小 | number | 大于0的整数 | 24 |
| color | 按钮颜色 string | string | rgb/hex | ‘#666’ |
| duration | 返回顶部的间隔时间 | number | 大于0的整数 | 300 |
vue点击返回顶部插件vue-totop的更多相关文章
- jQuery-点击返回顶部
在页面上,有时需要点击某个图标钮实现返回顶部的效果. 实现方式如下,给图标按钮增加名叫goTop-hook的类. // 点击返回顶部 $(window).scroll(function() { if ...
- js中点击返回顶部
window.scrollTo(0, 0);当点击返回顶部的时候调用这个方法即可 handleScrollTop(){ window.scrollTo(0, 0); }
- 编写jQuery插件--实现返回顶部插件
国庆过去一周多了,作为IT界的具有严重’工作狂‘性质的宅人,居然还没走出玩耍的心情,拖了程序猿的脚后跟了.最近工作不顺,心情不佳,想吐槽下公司,想了还是厚道点,以彼之道还施彼身,觉得自己也和他们同流合 ...
- javascript返回顶部插件+源码
javascript插件->returnTop.js: /* ** 插件名称returnTop.js ** 调用返回头部单例参数说明 ** 调用方式:turn.init(ele,speed); ...
- Jquery返回顶部插件
自己jquery开发的返回顶部,当时只为了自己用一下,为了方便,修改成了插件... 自己的博客现在用的也是这个插件..使用方便!! <!DOCTYPE html> <html> ...
- 在页面中有overflow-y:auto属性的div,当出现滚动条,点击返回顶部按钮,内容回这个div最顶部
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue工程化:返回顶部和底部的动画效果
. <template> <div> <div class="scroll" :class="{show:isActive}"&g ...
- Vue图片懒加载插件 - vue lazyload的简单使用
Vue module for lazyloading images in your applications. Some of goals of this project worth noting i ...
- jqury点击返回顶部代码
效果请看右下角:代码如下: <div class="totop"><img src="https://www.cnblogs.com/images/cn ...
随机推荐
- asp.net三层架构详解(转)
摘自:http://www.cnblogs.com/cresuccess/archive/2008/12/10/1351675.html 一.数据库 ,) ) no ...
- Python 绘图库的使用:matplotlib
Matplotlib 官方API地址:https://matplotlib.org/ 例子: import matplotlib.pyplot as plt num_list=[1.5,0.6,7.8 ...
- Java Jersey2使用总结
原文 http://blog.segmentfault.com/lenbo_ma/1190000000495321 主题 Java 前言 在短信平台一期工作中,为便于移动平台的开发,使用了Java ...
- 【js】typeof与instanceof
typeof 运算符 返回一个用来表示表达式的数据类型的字符串. typeof[()expression[]] ; expression 参数是需要查找类型信息的任意表达式. 说明 typeof 运算 ...
- jmeter --- 基于InfluxDB&Grafana的JMeter实时性能测试数据的监控和展示
转自:https://blog.csdn.net/RickyOne_RR/article/details/50637839 本文主要讲述如何利用JMeter监听器Backend Listener,配合 ...
- Unix环境高级编程(一)文件I/O
Unix系统中大多数文件I/O只需用到五个函数:open.read.write.lseek.close.本章说介绍的I/O是不带缓冲的,即:每个read和write都调用内核中的一个系统调用.不是IS ...
- AVL平衡二叉搜索树原理及各项操作编程实现
C语言版 #include<stdio.h> #include "fatal.h" struct AvlNode; typedef struct AvlNode *Po ...
- Linux时间子系统(十四) tick broadcast framework
一.前言 在内核中,有cpuidle framework可以控制cpu的节电:当没有进程调度到该cpu上执行的时候,swapper进程粉墨登场,将该cpu会被推入到idle状态.当然CPU的idle状 ...
- Bitmap具体解释与Bitmap的内存优化
感觉这里的排版看着更舒服些 Bitmap具体解释与Bitmap的内存优化 一.Bitmap: Bitmap是Android系统中的图像处理的最重要类之中的一个.用它能够获取图像文件信息,进行图像剪切. ...
- Linux 批量建立信任关系,实现ssh无password登陆的脚本
作用: 把当前机器的ssh公钥拷贝到其它机器.以实现从当前机器能够ssh无password登陆到其它机器 用法: 1)把要加入的ip地址写入到一个文件里.比方host 2)把脚本保存为sh文件,如 i ...