├── .babelrc
├── .gitattributes
├── .gitignore
├── LICENSE
├── README.md
├── build
    ├── gh-pages.sh
    ├── webpack.config.js
    ├── webpack.example.base.conf.js
    ├── webpack.example.dev.conf.js
    └── webpack.example.prod.conf.js
├── example
    ├── index.html
    └── src
    │   ├── App.vue
    │   ├── BackTopDemo.vue
    │   ├── Demo.vue
    │   ├── fonts
    │       ├── icomoon.svg
    │       ├── icomoon.ttf
    │       └── icomoon.woff
    │   ├── main.js
    │   ├── styles
    │       └── less
    │       │   ├── style.less
    │       │   └── variables.less
    │   └── template.js
├── lib
    ├── back-top.js
    └── vm-font.svg
├── package.json
└── src
    ├── components
        └── back-top.vue
    ├── fonts
        ├── vm-font.eot
        ├── vm-font.svg
        ├── vm-font.ttf
        └── vm-font.woff
    ├── index.js
    ├── styles
        └── less
        │   ├── back-top.less
        │   ├── base.less
        │   ├── font.less
        │   └── index.less
    └── utils
        ├── assist.js
        └── dom.js


/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 |   "presets": [
3 |     ["env", { "modules": false }]
4 |   ]
5 | }
6 | 


--------------------------------------------------------------------------------
/.gitattributes:
--------------------------------------------------------------------------------
1 | **/*.js linguist-language=Vue
2 | **/*.less linguist-language=Vue
3 | **/*.css linguist-language=Vue
4 | **/*.html linguist-language=Vue


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | .idea
4 | example/dist
5 | gh-pages


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2017 vue-multiple
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # back-top
 2 | 
 3 | > Vue-based back-top component
 4 | 
 5 | ## Install
 6 | 
 7 | ```bash
 8 | npm install vue-multiple-back-top -S
 9 | ```
10 | 
11 | ## Quick Start
12 | 
13 | ```bash
14 | import Vue from 'vue'
15 | import VmBackTop from 'vue-multiple-back-top'
16 | 
17 | Vue.component(VmBackTop.name, VmBackTop)
18 | ```
19 | 
20 | For more information, please refer to [back-top](http://vue-multiple.github.io/back-top) in our documentation.
21 | 
22 | ## Build Setup
23 | 
24 | ``` bash
25 | # install dependencies
26 | npm install
27 | 
28 | # serve with hot reload at localhost:8080
29 | npm run demo:dev
30 | 
31 | # build for demo with minification
32 | npm run demo:build
33 | 
34 | # build for gh-pages with minification
35 | npm run demo:prepublish
36 | 
37 | # build for production with minification
38 | npm run build
39 | ```
40 | 
41 | ## LICENSE
42 | 
43 | [MIT](http://opensource.org/licenses/MIT)
44 | 


--------------------------------------------------------------------------------
/build/gh-pages.sh:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env bash
2 | npm run demo:prepublish
3 | cd gh-pages
4 | git init
5 | git add -A
6 | git commit -m 'update gh-pages'
7 | git push -f git@github.com:vue-multiple/back-top.git master:gh-pages


--------------------------------------------------------------------------------
/build/webpack.config.js:
--------------------------------------------------------------------------------
 1 | var path = require('path')
 2 | var webpack = require('webpack')
 3 | var ExtractTextPlugin = require('extract-text-webpack-plugin')
 4 | 
 5 | module.exports = {
 6 |   entry: './src/index.js',
 7 |   output: {
 8 |     path: path.resolve(__dirname, '..', './lib'),
 9 |     filename: 'back-top.js',
10 |     library: 'back-top',
11 |     libraryTarget: 'umd'
12 |   },
13 |   externals: {
14 |     vue: {
15 |       root: 'Vue',
16 |       commonjs: 'vue',
17 |       commonjs2: 'vue',
18 |       amd: 'vue'
19 |     }
20 |   },
21 |   module: {
22 |     rules: [
23 |       {
24 |         test: /\.vue$/,
25 |         loader: 'vue-loader',
26 |         options: {
27 |           loaders: {
28 |             css: 'vue-style-loader!css-loader',
29 |             less: 'vue-style-loader!css-loader!less-loader',
30 |           }
31 |           // other vue-loader options go here
32 |         }
33 |       },
34 |       {
35 |         test: /\.css$/,
36 |           use: [
37 |               { loader: 'style-loader' },
38 |               { loader: 'css-loader' }
39 |           ]
40 |       },
41 |       {
42 |         test: /\.less$/,
43 |           use: [
44 |               { loader: 'style-loader' },
45 |               { loader: 'css-loader' },
46 |               { loader: 'less-loader' }
47 |           ]
48 |       },
49 |       {
50 |         test: /\.js$/,
51 |         loader: 'babel-loader',
52 |         exclude: /node_modules/
53 |       },
54 |       {
55 |         test: /\.(png|jpg|gif|svg)$/,
56 |         loader: 'file-loader',
57 |         options: {
58 |           name: '[name].[ext]?[hash]'
59 |         }
60 |       },
61 |       {
62 |         test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
63 |         loader: 'url-loader',
64 |         query: {
65 |           limit: 10000,
66 |           name: path.posix.join('static', 'fonts/[name].[hash:7].[ext]')
67 |         }
68 |       }
69 |     ]
70 |   },
71 |   resolve: {
72 |     extensions: ['.js', '.vue', '.json']
73 |   },
74 |   plugins: [
75 |     new webpack.optimize.UglifyJsPlugin({
76 |       sourceMap: true,
77 |       compress: {
78 |         warnings: false
79 |       }
80 |     })
81 |   ]
82 | }


--------------------------------------------------------------------------------
/build/webpack.example.base.conf.js:
--------------------------------------------------------------------------------
 1 | var path = require('path')
 2 | var ExtractTextPlugin = require('extract-text-webpack-plugin')
 3 | var isProduction = process.env.NODE_ENV === 'production'
 4 | 
 5 | module.exports = {
 6 |   entry: {
 7 |     app: './example/src/main.js'
 8 |   },
 9 |   output: {
10 |     path: '/example',
11 |     filename: '[name].js',
12 |     publicPath: '/'
13 |   },
14 |   module: {
15 |     rules: [
16 |       {
17 |         test: /\.vue$/,
18 |         loader: 'vue-loader',
19 |         options: {
20 |           // other vue-loader options go here
21 |           loaders: {
22 |             css: isProduction ? ExtractTextPlugin.extract({
23 |               fallback: 'vue-style-loader',
24 |               use: 'css-loader'
25 |             }) : 'vue-style-loader!css-loader',
26 |             less: isProduction ? ExtractTextPlugin.extract({
27 |               fallback: 'vue-style-loader',
28 |               use: ['css-loader', 'less-loader']
29 |             }) : 'vue-style-loader!css-loader!less-loader'
30 |           }
31 |         }
32 |       },
33 |       {
34 |         test: /\.js$/,
35 |         loader: 'babel-loader',
36 |         exclude: /node_modules/
37 |       },
38 |       {
39 |         test: /\.(png|jpg|gif|svg)$/,
40 |         loader: 'file-loader',
41 |         options: {
42 |           name: '[name].[ext]?[hash]'
43 |         }
44 |       },
45 |       {
46 |         test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
47 |         loader: 'url-loader',
48 |         query: {
49 |           limit: 10000,
50 |           name: path.posix.join('static', 'fonts/[name].[hash:7].[ext]')
51 |         }
52 |       }
53 |     ]
54 |   }
55 | }


--------------------------------------------------------------------------------
/build/webpack.example.dev.conf.js:
--------------------------------------------------------------------------------
 1 | var webpack = require('webpack')
 2 | var merge = require('webpack-merge')
 3 | var baseWebpackConfig = require('./webpack.example.base.conf')
 4 | var HtmlWebpackPlugin = require('html-webpack-plugin')
 5 | var FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
 6 | 
 7 | module.exports = merge(baseWebpackConfig, {
 8 |   module: {
 9 |     rules: [
10 |       {
11 |         test: /\.css$/,
12 |         loader: 'vue-style-loader!css-loader'
13 |       },
14 |       {
15 |         test: /\.less$/,
16 |         loader: 'vue-style-loader!css-loader!less-loader'
17 |       }
18 |     ]
19 |   },
20 |   // cheap-module-eval-source-map is faster for development
21 |   devtool: '#cheap-module-eval-source-map',
22 |   plugins: [
23 |     new webpack.DefinePlugin({
24 |       'process.env': {
25 |         NODE_ENV: '"development"'
26 |       }
27 |     }),
28 |     new webpack.NoEmitOnErrorsPlugin(),
29 |     new HtmlWebpackPlugin({
30 |       filename: 'index.html',
31 |       template: 'example/index.html',
32 |       inject: true
33 |     }),
34 |     new FriendlyErrorsPlugin()
35 |   ]
36 | })


--------------------------------------------------------------------------------
/build/webpack.example.prod.conf.js:
--------------------------------------------------------------------------------
 1 | var path = require('path')
 2 | var webpack = require('webpack')
 3 | var merge = require('webpack-merge')
 4 | var baseWebpackConfig = require('./webpack.example.base.conf')
 5 | var HtmlWebpackPlugin = require('html-webpack-plugin')
 6 | var ExtractTextPlugin = require('extract-text-webpack-plugin')
 7 | var isProduction = process.env.NODE_ENV === 'production'
 8 | 
 9 | module.exports = merge(baseWebpackConfig, {
10 |   module: {
11 |     rules: [
12 |       {
13 |         test: /\.css$/,
14 |         loader: ExtractTextPlugin.extract({
15 |           fallback: "vue-style-loader",
16 |           use: "css-loader"
17 |         })
18 |       },
19 |       {
20 |         test: /\.less/,
21 |         loader: ExtractTextPlugin.extract({
22 |           fallback: "vue-style-loader",
23 |           use: ["css-loader", "less-loader"]
24 |         })
25 |       }
26 |     ]
27 |   },
28 |   devtool: '#source-map',
29 |   output: {
30 |     path: path.resolve(__dirname, '..', `${isProduction ? './example/dist' : 'gh-pages'}`),
31 |     publicPath: isProduction ? '/' : '/back-top',
32 |     filename: 'js/[name].[chunkhash].js'
33 |   },
34 |   plugins: [
35 |     new webpack.DefinePlugin({
36 |       'process.env': {
37 |         NODE_ENV: '"production"'
38 |       }
39 |     }),
40 |     new webpack.optimize.UglifyJsPlugin({
41 |       sourceMap: true,
42 |       compress: {
43 |         warnings: false
44 |       }
45 |     }),
46 |     new ExtractTextPlugin({
47 |       filename: 'css/[name].[contenthash].css',
48 |       allChunks: true
49 |     }),
50 |     new HtmlWebpackPlugin({
51 |       filename: 'index.html',
52 |       template: 'example/index.html',
53 |       inject: true,
54 |       minify: {
55 |         removeComments: true,
56 |         collapseWhitespace: true,
57 |         removeAttributeQuotes: true
58 |         // more options:
59 |         // https://github.com/kangax/html-minifier#options-quick-reference
60 |       },
61 |       // necessary to consistently work with multiple chunks via CommonsChunkPlugin
62 |       chunksSortMode: 'dependency'
63 |     })
64 |   ]
65 | })
66 | 


--------------------------------------------------------------------------------
/example/index.html:
--------------------------------------------------------------------------------
 1 | <!Doctype html>
 2 | <html lang="en">
 3 | <head>
 4 |   <meta charset="UTF-8">
 5 |   <meta name="viewport"
 6 |         content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
 7 |   <meta http-equiv="X-UA-Compatible" content="ie=edge">
 8 |   <title>back-top</title>
 9 | </head>
10 | <body>
11 | <div id="app"></div>
12 | <!-- built files will be auto injected -->
13 | </body>
14 | </html>
15 | 


--------------------------------------------------------------------------------
/example/src/App.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div id="app">
 3 |     <back-top-demo></back-top-demo>
 4 |   </div>
 5 | </template>
 6 | 
 7 | <script type="es6">
 8 | import BackTopDemo from './BackTopDemo.vue'
 9 |     export default {
10 |         components: {
11 |             BackTopDemo
12 |         },
13 |         beforeCreate() {
14 |             console.log("%c Powered by https://github.com/Uzty","background-image:-webkit-gradient( linear, left top,right top, color-stop(0, #00a419),color-stop(0.15, #f44336), color-stop(0.29, #ff4300),color-stop(0.3, #AA00FF),color-stop(0.4, #8BC34A), color-stop(0.45, #607D8B),color-stop(0.6, #4096EE), color-stop(0.75, #D50000),color-stop(0.9, #4096EE), color-stop(1, #FF1A00));color:transparent;-webkit-background-clip:text;font-size:13px;");
15 |         },
16 |     }
17 | </script>
18 | 
19 | <style>
20 |   #app {
21 |     width: 1000px;
22 |     margin: 60px auto;
23 |     font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif;
24 |     -webkit-font-smoothing: antialiased;
25 |     -moz-osx-font-smoothing: grayscale;
26 |   }
27 | 
28 | </style>
29 | 


--------------------------------------------------------------------------------
/example/src/BackTopDemo.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div class="back-top-demo">
  3 |     <div class="back-top-demo__item">
  4 |       <h2 id="back-top-title">
  5 |         <a href="#back-top-title" aria-hidden="true" class="header-anchor">¶</a>
  6 |         BackTop 回到顶部
  7 |       </h2>
  8 |       <h3 id="gai-shu">
  9 |         <a href="#gai-shu" aria-hidden="true" class="header-anchor">¶</a>
 10 |         概述
 11 |       </h3>
 12 |       <p>当页面内容冗长，需要快捷返回顶部时使用，一般放置在页面右下角位置。</p>
 13 |     </div>
 14 |     <div class="back-top-demo__item">
 15 |       <h3 id="dai-ma-shi-li">
 16 |         <a href="#dai-ma-shi-li" aria-hidden="true" class="header-anchor">¶</a>
 17 |         代码示例
 18 |       </h3>
 19 |       <demo>
 20 |         <template slot="source">
 21 |           <span class="demonstration">基础用法</span>
 22 |           <vm-back-top></vm-back-top>
 23 |         </template>
 24 |         <template slot="highlight">
 25 |           <pre v-highlightjs="sourcecodeA"><code class="html javascript"></code></pre>
 26 |         </template>
 27 |         <template slot="description">
 28 |           <p>向下滚动页面，灰色的按钮为默认效果。</p>
 29 |           <p>默认位置距离页面右部和底部 30px，滚动至距顶端 400px 时显示。</p>
 30 |         </template>
 31 |       </demo>
 32 |       <demo>
 33 |         <template slot="source">
 34 |             <span class="demonstration">自定义样式</span>
 35 |             <vm-back-top :height="100" :bottom="200" :timing="'ease'">
 36 |               <div class="top">返回顶端</div>
 37 |             </vm-back-top>
 38 |         </template>
 39 |         <template slot="highlight">
 40 |           <pre v-highlightjs="sourcecodeB"><code class="html javascript"></code></pre>
 41 |         </template>
 42 |         <template slot="description">
 43 |           <p>向下滚动页面，蓝色的按钮为自定义效果。</p>
 44 |           <p>自定义了位置在页面底部 200px,滚动至距顶端 100px 时显示。</p>
 45 |           <p>过渡效果为ease，逐渐变慢</p>
 46 |         </template>
 47 |       </demo>
 48 |       <demo>
 49 |         <template slot="source">
 50 |           <span class="demonstration">带导航</span>
 51 |           <vm-back-top :height="100" :bottom="300" :duration="500" :options="options" @navClick="handleNavClick">
 52 |           </vm-back-top>
 53 |         </template>
 54 |         <template slot="highlight">
 55 |           <pre v-highlightjs="sourcecodeC"><code class="html javascript"></code></pre>
 56 |         </template>
 57 |         <template slot="description">
 58 |           <p>增加了导航配置</p>
 59 |           <p>鼠标移到组件上时显示导航</p>
 60 |           <p>点击导航页面滚动到该对应位置</p>
 61 |         </template>
 62 |       </demo>
 63 |     </div>
 64 |     <div class="rate-demo__item">
 65 |       <h3 id="attributes">
 66 |         <a href="./#attributes" aria-hidden="true" class="header-anchor">¶</a>
 67 |         Attributes
 68 |       </h3>
 69 |       <table class="table">
 70 |         <thead>
 71 |         <th>参数</th>
 72 |         <th>说明</th>
 73 |         <th>类型</th>
 74 |         <th>可选值</th>
 75 |         <th>默认值</th>
 76 |         </thead>
 77 |         <tbody>
 78 |         <tr>
 79 |           <td>height</i></td>
 80 |           <td>页面滚动高度达到该值时才显示BackTop组件</td>
 81 |           <td>number</td>
 82 |           <td>—</td>
 83 |           <td>400</td>
 84 |         </tr>
 85 |         <tr>
 86 |           <td>bottom</i></td>
 87 |           <td>组件距离底部的距离</td>
 88 |           <td>number</td>
 89 |           <td>—</td>
 90 |           <td>30</td>
 91 |         </tr>
 92 |         <tr>
 93 |           <td>right</i></td>
 94 |           <td>组件距离右部的距离</td>
 95 |           <td>number</td>
 96 |           <td>—</td>
 97 |           <td>30</td>
 98 |         </tr>
 99 |         <tr>
100 |           <td>duration</i></td>
101 |           <td>滚动动画持续时间，单位 毫秒</td>
102 |           <td>number</td>
103 |           <td>—</td>
104 |           <td>1000</td>
105 |         </tr>
106 |         <tr>
107 |           <td>timing</i></td>
108 |           <td>滚动动画速率变化</td>
109 |           <td>string</td>
110 |           <td>linear/ease</td>
111 |           <td>linear</td>
112 |         </tr>
113 |         <tr>
114 |           <td>options</i></td>
115 |           <td>显示导航的配置，每一项需要传显示的label和元素的id</td>
116 |           <td>array</td>
117 |           <td>—</td>
118 |           <td>—</td>
119 |         </tr>
120 |         <tr>
121 |           <td>navItemClass</i></td>
122 |           <td>导航里每一项的类名</td>
123 |           <td>string</td>
124 |           <td>—</td>
125 |           <td>—</td>
126 |         </tr>
127 |         </tbody>
128 |       </table>
129 |     </div>
130 |     <div class="rate-demo__item">
131 |       <h3 id="event">
132 |         <a href="./#event" aria-hidden="true" class="header-anchor">¶</a>
133 |         Events
134 |       </h3> 
135 |       <table class="table">
136 |         <thead>
137 |         <th>事件名称</th>
138 |         <th>说明</th>
139 |         <th>回调参数</th>
140 |         </thead>
141 |         <tbody>
142 |         <tr>
143 |           <td>click</td>
144 |           <td>点击按钮时触发</td>
145 |           <td>无</td>
146 |         </tr>
147 |         <tr>
148 |           <td>navClick</td>
149 |           <td>点击导航时触发</td>
150 |           <td>点击该项的id</td>
151 |         </tr>
152 |         </tbody>
153 |       </table>
154 |     </div>
155 |   </div>
156 | </template>
157 | <script>
158 |     import { sourcecodeA, sourcecodeB, sourcecodeC } from './template.js'
159 |   import Demo from './Demo.vue'
160 | 
161 |   export default {
162 |     data () {
163 |       return {
164 |           options:[
165 |               {
166 |                   id:'back-top-title',
167 |                   label:'BackTop回到顶部'
168 |               },
169 |               {
170 |                   id:'gai-shu',
171 |                   label:'概述'
172 |               },
173 |               {
174 |                   id:'dai-ma-shi-li',
175 |                   label:'代码示例'
176 |               }
177 |           ],
178 |         sourcecodeA,
179 |         sourcecodeB,
180 |         sourcecodeC
181 | 
182 |       }
183 |     },
184 |     methods: {
185 |         handleNavClick (val) {
186 |             console.log(222)
187 |         console.log(val);
188 |       }
189 |     },
190 |     components: {
191 |       Demo
192 |     }
193 |   }
194 | </script>
195 | <style lang="less" rel="stylesheet/less">
196 |   .top{
197 |     padding: 10px;
198 |     background: rgba(0, 153, 229, .7);
199 |     color: #fff;
200 |     text-align: center;
201 |     border-radius: 2px;
202 |   }
203 |   .back-top-demo {
204 |     h2, h3 {
205 |       font-weight: 400;
206 |       color: #1f2f3d;
207 |     }
208 |     h2 {
209 |       font-size: 28px;
210 |       margin: 0
211 |     }
212 |     h3 {
213 |       font-size: 22px;
214 |       margin: 45px 0 15px;
215 |     }
216 |     h3, h2 {
217 |       &:hover {
218 |         a {
219 |           opacity: .4;
220 |         }
221 |       }
222 |       a {
223 |         float: left;
224 |         margin-left: -20px;
225 |         opacity: 0;
226 |         cursor: pointer;
227 |         color: #4078c0;
228 |         text-decoration: none;
229 |         &:hover {
230 |           opacity: .4;
231 |         }
232 |       }
233 |     }
234 |     p {
235 |       font-size: 14px;
236 |       color: #5e6d82;
237 |       line-height: 1.5em;
238 |       a {
239 |         color: #2d8cf0;
240 |         background: 0 0;
241 |         text-decoration: none;
242 |         outline: 0;
243 |         cursor: pointer;
244 |         transition: color .2s ease;
245 |         &:hover {
246 |           color: #57a3f3;
247 |         }
248 |       }
249 |     }
250 |     .new {
251 |       font-style: normal;
252 |       color: #FF4949;
253 |       code {
254 |         background-color: #FF4949 !important;
255 |         color: #fff !important;
256 |       }
257 |     }
258 |     .table {
259 |       border-collapse: collapse;
260 |       width: 100%;
261 |       background-color: #fff;
262 |       color: #5e6d82;
263 |       font-size: 14px;
264 |       margin-bottom: 45px;
265 |       line-height: 1.5em;
266 |       th {
267 |         text-align: left;
268 |         border-top: 1px solid #eaeefb;
269 |         background-color: #eff2f7;
270 |         white-space: nowrap;
271 |       }
272 |       th, td {
273 |         border-bottom: 1px solid #eaeefb;
274 |         padding: 10px;
275 |         max-width: 250px;
276 |       }
277 |     }
278 |   }
279 | </style>
280 | 


--------------------------------------------------------------------------------
/example/src/Demo.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div class="demo">
  3 |     <div class="source" :style="{ padding: multiple ? '0px': '24px' }">
  4 |       <slot name="source"></slot>
  5 |     </div>
  6 |     <div class="meta" ref="meta">
  7 |       <div class="description" ref="description">
  8 |         <slot name="description"></slot>
  9 |       </div>
 10 |       <div class="highlight" ref="highlight">
 11 |         <slot name="highlight"></slot>
 12 |       </div>
 13 |     </div>
 14 |     <div class="control" 
 15 |       @click="handleShowMeta" 
 16 |       @mousemove="showText = true" 
 17 |       @mouseleave="showText = false">
 18 |         <i :class="['icon', (showMeta ? 'icon-circle-up' : 'icon-circle-down'), {'hovering': showText}]"></i>
 19 |         <transition name="text-slide">
 20 |           <span v-if="showText">{{ showMeta ? '隐藏代码' : '显示代码' }}</span>
 21 |         </transition>
 22 |     </div>
 23 |   </div>
 24 | </template>
 25 | <script>
 26 |   export default {
 27 |     props: {
 28 |       multiple: {
 29 |         type: Boolean,
 30 |         default: false
 31 |       }
 32 |     },
 33 |     data () {
 34 |       return {
 35 |         showMeta: true,
 36 |         showText: false
 37 |       }
 38 |     },
 39 |     mounted (){
 40 |         if (!this.showMeta) {
 41 |             this.$refs.meta.style.height = 0
 42 |         } else {
 43 |             this.$refs.meta.style.height = Math.max(this.$refs.highlight.clientHeight, this.$refs.description.clientHeight) + 'px'
 44 |         }
 45 |     },
 46 |     methods: {
 47 |       handleShowMeta () {
 48 |         if (this.showMeta) {
 49 |           this.$refs.meta.style.height = 0
 50 |         } else {
 51 |           this.$refs.meta.style.height = Math.max(this.$refs.highlight.clientHeight, this.$refs.description.clientHeight) + 'px'
 52 |         }
 53 |         this.showMeta = !this.showMeta
 54 |       }
 55 |     }
 56 |   }
 57 | </script>
 58 | <style lang="less" rel="stylesheet/less">
 59 |   @import "./styles/less/style.less";
 60 | 
 61 |   .demo {
 62 |     border: 1px solid #eaeefb;
 63 |     border-radius: 4px;
 64 |     transition: .2s;
 65 |     &:hover {
 66 |       box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
 67 |     }
 68 |     code {
 69 |       font-family: Menlo, Monaco, Consolas, Courier, monospace;
 70 |     }
 71 |     .block {
 72 |       float: left;
 73 |       width: 50%;
 74 |       padding: 30px 0;
 75 |       text-align: center;
 76 |       border-right: 1px solid #eff2f6;
 77 |       border-bottom: 1px solid #eff2f6;
 78 |       box-sizing: border-box;
 79 |       &:nth-child(2n) {
 80 |         border-right: none;
 81 |       }
 82 |       &:nth-last-child(2), &:nth-last-child(1) {
 83 |         border-bottom: none;
 84 |       }
 85 |       .demonstration {
 86 |         display: inline-block;
 87 |         color: #8492a6;
 88 |         font-size: 14px;
 89 |         margin-bottom: 20px;
 90 |       }
 91 |     }
 92 |     .meta {
 93 |       background-color: #f9fafc;
 94 |       border-top: 1px solid #eaeefb;clear: both;
 95 |       overflow: hidden;
 96 |       height: 0;
 97 |       transition: height .2s;
 98 |       .description {
 99 |         float: right;
100 |         width: 40%;
101 |         padding: 18px 24px;
102 |         font-size: 14px;
103 |         line-height: 1.8;
104 |         color: #5e6d82;
105 |         word-break: break-word;
106 |         border-left: 1px solid #eaeefb;
107 |         box-sizing: border-box;
108 |         p {
109 |           margin: 0 0 12px;
110 |           line-height: 1.8;
111 |           font-size: 14px;
112 |           color: #5e6d82;
113 |         }
114 |         code {
115 |           color: #5e6d82;
116 |           background-color: #e6effb;
117 |           margin: 0 4px;
118 |           display: inline-block;
119 |           padding: 1px 5px;
120 |           font-size: 12px;
121 |           border-radius: 3px;
122 |           height: 18px;
123 |           line-height: 18px;
124 |         }
125 |       }
126 |       .highlight {
127 |         width: 60%;
128 |         border-right: 1px solid #eaeefb;
129 |         pre {
130 |           margin: 0;
131 |           code {
132 |             &.hljs {
133 |               max-height: none;  
134 |               margin: 0;
135 |               padding: 18px 24px;
136 |               line-height: 1.8;
137 |               font-size: 12px;  
138 |               background-color: #f9fafc;
139 |               border: none;
140 |               border-radius: 0;
141 |               -webkit-font-smoothing: auto;
142 |             }
143 |           }
144 |         }
145 |       }
146 |     }
147 |     .control {
148 |       position: relative;
149 |       height: 36px;
150 |       margin-top: -1px;
151 |       text-align: center;
152 |       color: #d3dce6;
153 |       background-color: #fff;
154 |       border-top: 1px solid #eaeefb;
155 |       border-bottom-left-radius: 4px;
156 |       border-bottom-right-radius: 4px;
157 |       box-sizing: border-box;
158 |       cursor: pointer;
159 |       transition: .2s;
160 |       &:hover {
161 |         color: #20a0ff;
162 |         background-color: #f9fafc;
163 |       }
164 |       i {
165 |         display: inline-block;
166 |         font-size: 12px;
167 |         line-height: 36px;
168 |         transition: .3s;
169 |         &.hovering {
170 |           transform: translateX(-40px);
171 |         }
172 |       }
173 |       span {
174 |         position: absolute;
175 |         transform: translateX(-30px);
176 |         font-size: 14px;
177 |         line-height: 36px;
178 |         transition: .3s;
179 |       }
180 |       .text-slide-enter, .text-slide-leave-active {
181 |         opacity: 0;
182 |         transform: translateX(10px)
183 |       }
184 |     }
185 |   }
186 |   .hljs {
187 |     display: block;
188 |     overflow-x: auto;
189 |     padding: .5em;
190 |     background: #fff
191 |   }
192 |   .hljs, .hljs-subst {
193 |     color: #000
194 |   }
195 |   .hljs-addition, .hljs-meta, .hljs-string, .hljs-symbol, .hljs-template-tag, .hljs-template-variable {
196 |     color: #756bb1
197 |   }
198 |   .hljs-comment, .hljs-quote {
199 |     color: #636363
200 |   }
201 |   .hljs-bullet, .hljs-link, .hljs-literal, .hljs-number, .hljs-regexp {
202 |     color: #31a354
203 |   }
204 |   .hljs-deletion, .hljs-variable {
205 |     color: #88f
206 |   }
207 |   .hljs-built_in, .hljs-doctag, .hljs-keyword, .hljs-name, .hljs-section, .hljs-selector-class, .hljs-selector-id, .hljs-selector-tag, .hljs-strong, .hljs-tag, .hljs-title, .hljs-type {
208 |     color: #3182bd
209 |   }
210 |   .hljs-emphasis {
211 |     font-style: italic
212 |   }
213 |   .hljs-attribute {
214 |     color: #e6550d
215 |   }
216 | </style>


--------------------------------------------------------------------------------
/example/src/fonts/icomoon.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" standalone="no"?>
 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
 3 | <svg xmlns="http://www.w3.org/2000/svg">
 4 | <metadata>Generated by IcoMoon</metadata>
 5 | <defs>
 6 | <font id="icomoon" horiz-adv-x="1024">
 7 | <font-face units-per-em="1024" ascent="960" descent="-64" />
 8 | <missing-glyph horiz-adv-x="1024" />
 9 | <glyph unicode="&#x20;" horiz-adv-x="512" d="" />
10 | <glyph unicode="&#xea41;" glyph-name="circle-up" d="M0 448c0-282.77 229.23-512 512-512s512 229.23 512 512-229.23 512-512 512-512-229.23-512-512zM928 448c0-229.75-186.25-416-416-416s-416 186.25-416 416 186.25 416 416 416 416-186.25 416-416zM706.744 290.744l90.512 90.512-285.256 285.254-285.254-285.256 90.508-90.508 194.746 194.744z" />
11 | <glyph unicode="&#xea43;" glyph-name="circle-down" d="M1024 448c0 282.77-229.23 512-512 512s-512-229.23-512-512 229.23-512 512-512 512 229.23 512 512zM96 448c0 229.75 186.25 416 416 416s416-186.25 416-416-186.25-416-416-416-416 186.25-416 416zM317.256 605.256l-90.512-90.512 285.256-285.254 285.254 285.256-90.508 90.508-194.746-194.744z" />
12 | <glyph unicode="&#xea7f;" glyph-name="embed2" d="M576 224l96-96 320 320-320 320-96-96 224-224zM448 672l-96 96-320-320 320-320 96 96-224 224z" />
13 | <glyph unicode="&#xea80;" glyph-name="embed" horiz-adv-x="1280" d="M832 224l96-96 320 320-320 320-96-96 224-224zM448 672l-96 96-320-320 320-320 96 96-224 224zM701.298 809.481l69.468-18.944-191.987-704.026-69.468 18.944 191.987 704.026z" />
14 | </font></defs></svg>


--------------------------------------------------------------------------------
/example/src/fonts/icomoon.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/vue-multiple/back-top/e3a194f39aa33d4242d3b76ce7bdaef75f6283c1/example/src/fonts/icomoon.ttf


--------------------------------------------------------------------------------
/example/src/fonts/icomoon.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/vue-multiple/back-top/e3a194f39aa33d4242d3b76ce7bdaef75f6283c1/example/src/fonts/icomoon.woff


--------------------------------------------------------------------------------
/example/src/main.js:
--------------------------------------------------------------------------------
 1 | import Vue from 'vue'
 2 | import App from './App.vue'
 3 | 
 4 | import VueHighlightJS from 'vue-highlightjs'
 5 | Vue.use(VueHighlightJS)
 6 | 
 7 | import BackTop from '../../src/index.js'
 8 | Vue.component(BackTop.name, BackTop)
 9 | 
10 | new Vue({
11 |     el: '#app',
12 |     render: h => h(App)
13 | })
14 | 


--------------------------------------------------------------------------------
/example/src/styles/less/style.less:
--------------------------------------------------------------------------------
 1 | @import "variables";
 2 | 
 3 | @font-face {
 4 |   font-family: 'icomoon';
 5 |   src:
 6 |     url('@{icomoon-font-path}/icomoon.ttf?tgex06') format('truetype'),
 7 |     url('@{icomoon-font-path}/icomoon.woff?tgex06') format('woff'),
 8 |     url('@{icomoon-font-path}/icomoon.svg?tgex06#icomoon') format('svg');
 9 |   font-weight: normal;
10 |   font-style: normal;
11 | }
12 | 
13 | [class^="icon-"], [class*=" icon-"] {
14 |   /* use !important to prevent issues with browser extensions that change fonts */
15 |   font-family: 'icomoon' !important;
16 |   speak: none;
17 |   font-style: normal;
18 |   font-weight: normal;
19 |   font-variant: normal;
20 |   text-transform: none;
21 |   line-height: 1;
22 | 
23 |   /* Better Font Rendering =========== */
24 |   -webkit-font-smoothing: antialiased;
25 |   -moz-osx-font-smoothing: grayscale;
26 | }
27 | 
28 | .icon-circle-up {
29 |   &:before {
30 |     content: @icon-circle-up;
31 |   }
32 | }
33 | .icon-circle-down {
34 |   &:before {
35 |     content: @icon-circle-down;
36 |   }
37 | }
38 | .icon-embed2 {
39 |   &:before {
40 |     content: @icon-embed2;
41 |   }
42 | }
43 | .icon-embed {
44 |   &:before {
45 |     content: @icon-embed;
46 |   }
47 | }
48 | 
49 | 


--------------------------------------------------------------------------------
/example/src/styles/less/variables.less:
--------------------------------------------------------------------------------
1 | @icomoon-font-path: "../../fonts";
2 | 
3 | @icon-circle-up: "\ea41";
4 | @icon-circle-down: "\ea43";
5 | @icon-embed2: "\ea7f";
6 | @icon-embed: "\ea80";
7 | 
8 | 


--------------------------------------------------------------------------------
/example/src/template.js:
--------------------------------------------------------------------------------
 1 | export const sourcecodeA = `<template>
 2 |      <vm-back-top></vm-back-top>
 3 | </template>
 4 | <script>
 5 |     export default {
 6 |         
 7 |     }
 8 | </script>`
 9 | 
10 | export const sourcecodeB = `<template>
11 |   <vm-back-top :bottom="100" :duration="1000" :timing="'ease'">
12 |     <div class="top">返回顶端</div>
13 |   </vm-back-top>
14 | </template>
15 | <script>
16 |   export default {
17 |    
18 |   }
19 | </script>
20 | <style scoped>
21 |     .top{
22 |         padding: 10px;
23 |         background: rgba(0, 153, 229, .7);
24 |         color: #fff;
25 |         text-align: center;
26 |         border-radius: 2px;
27 |     }
28 | </style>`
29 | 
30 | export const sourcecodeC = `<template slot="source">
31 |   <vm-back-top :height="100" :bottom="300" :duration="500" :options="options"></vm-back-top>
32 | </template>
33 | 
34 | <script>
35 |   export default {
36 |     data () {
37 |       return {
38 |        options:[
39 |               {
40 |                   id:'back-top-title',
41 |                   label:'BackTop回到顶部'
42 |               },
43 |               {
44 |                   id:'gai-shu',
45 |                   label:'概述'
46 |               },
47 |               {
48 |                   id:'dai-ma-shi-li',
49 |                   label:'代码示例'
50 |               }
51 |           ],
52 |       }
53 |     }
54 |   }
55 | </script>`
56 | 
57 | 
58 | 
59 | 


--------------------------------------------------------------------------------
/lib/back-top.js:
--------------------------------------------------------------------------------
1 | !function(A,s){"object"==typeof exports&&"object"==typeof module?module.exports=s(require("vue")):"function"==typeof define&&define.amd?define(["vue"],s):"object"==typeof exports?exports["back-top"]=s(require("vue")):A["back-top"]=s(A.Vue)}(this,function(A){return function(A){function s(n){if(t[n])return t[n].exports;var e=t[n]={i:n,l:!1,exports:{}};return A[n].call(e.exports,e,e.exports,s),e.l=!0,e.exports}var t={};return s.m=A,s.c=t,s.i=function(A){return A},s.d=function(A,t,n){s.o(A,t)||Object.defineProperty(A,t,{configurable:!1,enumerable:!0,get:n})},s.n=function(A){var t=A&&A.__esModule?function(){return A.default}:function(){return A};return s.d(t,"a",t),t},s.o=function(A,s){return Object.prototype.hasOwnProperty.call(A,s)},s.p="",s(s.s=4)}([function(A,s){A.exports="data:application/vnd.ms-fontobject;base64,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"},function(A,s,t){var n=t(7);"string"==typeof n&&(n=[[A.i,n,""]]);var e={};e.transform=void 0;t(10)(n,e);n.locals&&(A.exports=n.locals)},function(A,s,t){var n=t(14)(t(3),t(15),null,null,null);n.options.__file="F:\\github-workspace\\back-top\\src\\components\\back-top.vue",n.esModule&&Object.keys(n.esModule).some(function(A){return"default"!==A&&"__"!==A.substr(0,2)})&&console.error("named exports are not supported in *.vue files."),n.options.functional&&console.error("[vue-loader] back-top.vue: functional components are not supported with templates, they should use render functions."),A.exports=n.exports},function(A,s,t){"use strict";function n(A,s,t){return s in A?Object.defineProperty(A,s,{value:t,enumerable:!0,configurable:!0,writable:!0}):A[s]=t,A}Object.defineProperty(s,"__esModule",{value:!0});var e=t(5),i=t(6);s.default={name:"VmBackTop",componentName:"VmBackTop",data:function(){return{backTop:!1,navShow:!1}},props:{height:{type:Number,default:400},bottom:{type:Number,default:30},right:{type:Number,default:30},duration:{type:Number,default:1e3},timing:{type:String,default:"linear"},options:{type:Array,default:function(){return[]}},navItemClass:{type:String,default:""}},mounted:function(){t.i(i.a)(window,"scroll",this.handleScroll),t.i(i.a)(window,"resize",this.handleScroll)},beforeDestroy:function(){t.i(i.b)(window,"scroll",this.handleScroll),t.i(i.b)(window,"resize",this.handleScroll)},computed:{classes:function(){return["vm-back-top",n({},"vm-back-top-show",this.backTop)]},styles:function(){return{bottom:this.bottom+"px",right:this.right+"px"}},innerClasses:function(){return"vm-back-top-inner"},nav:function(){return["vm-back-top-nav"]},navItem:function(){return["vm-back-top-nav-item",""+this.navItemClass]}},methods:{handleScroll:function(){this.backTop=window.pageYOffset>=this.height},back:function(){var A=document.documentElement.scrollTop||document.body.scrollTop;t.i(e.a)(window,A,0,this.duration,this.timing),this.$emit("click")},showNav:function(){this.navShow=!0},hideNav:function(){this.navShow=!1},handleNavClick:function(A){var s=document.documentElement.scrollTop||document.body.scrollTop,n=t.i(i.c)(document.getElementById(A)).y;t.i(e.a)(window,s,n,this.duration,this.timing),this.$emit("navClick",A)}}}},function(A,s,t){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var n=t(2),e=t.n(n),i=t(1);t.n(i);s.default=e.a},function(A,s,t){"use strict";function n(A){function s(t,n,e){if(t!==n){var i=t+e>n?n:t+e;t>n&&(i=t-e<n?n:t-e),A===window?window.scrollTo(i,i):A.scrollTop=i,window.requestAnimationFrame(function(){return s(i,n,e)})}}function t(s,n){if(s!==n){var e=Math.ceil(Math.abs(s-n)/w);e=e>0?Math.ceil(e):Math.floor(e);var i=s+e>n?n:s+e;s>n&&(i=s-e<n?n:s-e),A===window?window.scrollTo(i,i):A.scrollTop=i,window.requestAnimationFrame(function(){return t(i,n)})}}var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,e=arguments[2],i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:500,o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:"linear";window.requestAnimationFrame||(window.requestAnimationFrame=window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.msRequestAnimationFrame||function(A){return window.setTimeout(A,1e3/60)});var r=Math.abs(n-e),B=Math.ceil(r/(60*i/1e3)),w=1/(1-Math.pow(10/r,1/(60*i/1e3-10)));"ease"===o?t(n,e):s(n,e,B)}s.a=n},function(A,s,t){"use strict";t.d(s,"a",function(){return o}),t.d(s,"b",function(){return r}),t.d(s,"c",function(){return B});var n=t(16),e=t.n(n),i=e.a.prototype.$isServer,o=function(){return!i&&document.addEventListener?function(A,s,t){A&&s&&t&&A.addEventListener(s,t,!1)}:function(A,s,t){A&&s&&t&&A.attachEvent("on"+s,t)}}(),r=function(){return!i&&document.removeEventListener?function(A,s,t){A&&s&&A.removeEventListener(s,t,!1)}:function(A,s,t){A&&s&&A.detachEvent("on"+s,t)}}(),B=function(A){for(var s=A.offsetLeft,t=A.offsetTop;A=A.offsetParent;)s+=A.offsetLeft,t+=A.offsetTop;return{x:s,y:t}}},function(A,s,t){s=A.exports=t(8)(void 0),s.push([A.i,'@font-face {\n  font-family: "vm-backtop-font";\n  src: url('+t(0)+");\n  /* IE9*/\n  src: url("+t(0)+"#iefix) format('embedded-opentype'),  url("+t(13)+") format('woff'),  url("+t(12)+") format('truetype'),  url("+t(9)+'#iconfont) format(\'svg\');\n  /* iOS 4.1- */\n}\n.vm-backtop-icon-een {\n  display: inline-block;\n  font-family: "vm-backtop-font" !important;\n  font-size: 16px;\n  font-style: normal;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n.vm-backtop-icon-een:before {\n  content: "\\E607";\n}\n.vm-back-top {\n  z-index: 10;\n  position: fixed;\n  cursor: pointer;\n  display: none;\n}\n.vm-back-top.vm-back-top-show {\n  display: block;\n}\n.vm-back-top-inner {\n  background-color: rgba(0, 0, 0, 0.6);\n  border-radius: 2px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n  transition: all 0.2s ease-in-out;\n}\n.vm-back-top-inner:hover {\n  background-color: rgba(0, 0, 0, 0.7);\n}\n.vm-back-top i {\n  color: #fff;\n  font-size: 24px;\n  padding: 8.5px 10px;\n}\n.vm-back-top-nav {\n  position: absolute;\n  right: 100%;\n  bottom: 0;\n  border-radius: 3px;\n  overflow: hidden;\n}\n.vm-back-top-nav-item {\n  height: 30px;\n  line-height: 30px;\n  text-align: left;\n  background-color: rgba(0, 0, 0, 0.6);\n  color: #fff;\n  padding: 2px 10px;\n  white-space: nowrap;\n}\n.vm-back-top-nav-item:hover {\n  background-color: rgba(0, 0, 0, 0.7);\n}\n',""])},function(A,s){function t(A,s){var t=A[1]||"",e=A[3];if(!e)return t;if(s&&"function"==typeof btoa){var i=n(e);return[t].concat(e.sources.map(function(A){return"/*# sourceURL="+e.sourceRoot+A+" */"})).concat([i]).join("\n")}return[t].join("\n")}function n(A){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(A))))+" */"}A.exports=function(A){var s=[];return s.toString=function(){return this.map(function(s){var n=t(s,A);return s[2]?"@media "+s[2]+"{"+n+"}":n}).join("")},s.i=function(A,t){"string"==typeof A&&(A=[[null,A,""]]);for(var n={},e=0;e<this.length;e++){var i=this[e][0];"number"==typeof i&&(n[i]=!0)}for(e=0;e<A.length;e++){var o=A[e];"number"==typeof o[0]&&n[o[0]]||(t&&!o[2]?o[2]=t:t&&(o[2]="("+o[2]+") and ("+t+")"),s.push(o))}},s}},function(A,s,t){A.exports=t.p+"vm-font.svg?9d162ed7513cca41ce4552d9f36e678f"},function(A,s,t){function n(A,s){for(var t=0;t<A.length;t++){var n=A[t],e=a[n.id];if(e){e.refs++;for(var i=0;i<e.parts.length;i++)e.parts[i](n.parts[i]);for(;i<n.parts.length;i++)e.parts.push(g(n.parts[i],s))}else{for(var o=[],i=0;i<n.parts.length;i++)o.push(g(n.parts[i],s));a[n.id]={id:n.id,refs:1,parts:o}}}}function e(A,s){for(var t=[],n={},e=0;e<A.length;e++){var i=A[e],o=s.base?i[0]+s.base:i[0],r=i[1],B=i[2],w=i[3],g={css:r,media:B,sourceMap:w};n[o]?n[o].parts.push(g):t.push(n[o]={id:o,parts:[g]})}return t}function i(A,s){var t=E(A.insertInto);if(!t)throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");var n=I[I.length-1];if("top"===A.insertAt)n?n.nextSibling?t.insertBefore(s,n.nextSibling):t.appendChild(s):t.insertBefore(s,t.firstChild),I.push(s);else{if("bottom"!==A.insertAt)throw new Error("Invalid value for parameter 'insertAt'. Must be 'top' or 'bottom'.");t.appendChild(s)}}function o(A){if(null===A.parentNode)return!1;A.parentNode.removeChild(A);var s=I.indexOf(A);s>=0&&I.splice(s,1)}function r(A){var s=document.createElement("style");return A.attrs.type="text/css",w(s,A.attrs),i(A,s),s}function B(A){var s=document.createElement("link");return A.attrs.type="text/css",A.attrs.rel="stylesheet",w(s,A.attrs),i(A,s),s}function w(A,s){Object.keys(s).forEach(function(t){A.setAttribute(t,s[t])})}function g(A,s){var t,n,e,i;if(s.transform&&A.css){if(!(i=s.transform(A.css)))return function(){};A.css=i}if(s.singleton){var w=l++;t=u||(u=r(s)),n=C.bind(null,t,w,!1),e=C.bind(null,t,w,!0)}else A.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(t=B(s),n=Q.bind(null,t,s),e=function(){o(t),t.href&&URL.revokeObjectURL(t.href)}):(t=r(s),n=c.bind(null,t),e=function(){o(t)});return n(A),function(s){if(s){if(s.css===A.css&&s.media===A.media&&s.sourceMap===A.sourceMap)return;n(A=s)}else e()}}function C(A,s,t,n){var e=t?"":n.css;if(A.styleSheet)A.styleSheet.cssText=f(s,e);else{var i=document.createTextNode(e),o=A.childNodes;o[s]&&A.removeChild(o[s]),o.length?A.insertBefore(i,o[s]):A.appendChild(i)}}function c(A,s){var t=s.css,n=s.media;if(n&&A.setAttribute("media",n),A.styleSheet)A.styleSheet.cssText=t;else{for(;A.firstChild;)A.removeChild(A.firstChild);A.appendChild(document.createTextNode(t))}}function Q(A,s,t){var n=t.css,e=t.sourceMap,i=void 0===s.convertToAbsoluteUrls&&e;(s.convertToAbsoluteUrls||i)&&(n=L(n)),e&&(n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */");var o=new Blob([n],{type:"text/css"}),r=A.href;A.href=URL.createObjectURL(o),r&&URL.revokeObjectURL(r)}var a={},y=function(A){var s;return function(){return void 0===s&&(s=A.apply(this,arguments)),s}}(function(){return window&&document&&document.all&&!window.atob}),E=function(A){var s={};return function(t){return void 0===s[t]&&(s[t]=A.call(this,t)),s[t]}}(function(A){return document.querySelector(A)}),u=null,l=0,I=[],L=t(11);A.exports=function(A,s){if("undefined"!=typeof DEBUG&&DEBUG&&"object"!=typeof document)throw new Error("The style-loader cannot be used in a non-browser environment");s=s||{},s.attrs="object"==typeof s.attrs?s.attrs:{},s.singleton||(s.singleton=y()),s.insertInto||(s.insertInto="head"),s.insertAt||(s.insertAt="bottom");var t=e(A,s);return n(t,s),function(A){for(var i=[],o=0;o<t.length;o++){var r=t[o],B=a[r.id];B.refs--,i.push(B)}if(A){n(e(A,s),s)}for(var o=0;o<i.length;o++){var B=i[o];if(0===B.refs){for(var w=0;w<B.parts.length;w++)B.parts[w]();delete a[B.id]}}}};var f=function(){var A=[];return function(s,t){return A[s]=t,A.filter(Boolean).join("\n")}}()},function(A,s){A.exports=function(A){var s="undefined"!=typeof window&&window.location;if(!s)throw new Error("fixUrls requires window.location");if(!A||"string"!=typeof A)return A;var t=s.protocol+"//"+s.host,n=t+s.pathname.replace(/\/[^\/]*$/,"/");return A.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi,function(A,s){var e=s.trim().replace(/^"(.*)"$/,function(A,s){return s}).replace(/^'(.*)'$/,function(A,s){return s});if(/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/)/i.test(e))return A;var i;return i=0===e.indexOf("//")?e:0===e.indexOf("/")?t+e:n+e.replace(/^\.\//,""),"url("+JSON.stringify(i)+")"})}},function(A,s){A.exports="data:application/x-font-ttf;base64,AAEAAAAQAQAABAAARkZUTXdnDLYAAAEMAAAAHEdERUYAMgAGAAABKAAAACBPUy8yVvNYpgAAAUgAAABWY21hcACN7NoAAAGgAAABUmN2dCAMlf+2AAAI5AAAACRmcGdtMPeelQAACQgAAAmWZ2FzcAAAABAAAAjcAAAACGdseWbjDfovAAAC9AAAAu5oZWFkDjOt3AAABeQAAAA2aGhlYQc1A+cAAAYcAAAAJGhtdHgNPgBtAAAGQAAAABRsb2NhATwBdwAABlQAAAAMbWF4cAEnCisAAAZgAAAAIG5hbWUULc8UAAAGgAAAAitwb3N0A8hmcgAACKwAAAAwcHJlcKW5vmYAABKgAAAAlQAAAAEAAAAAzD2izwAAAADVlLTzAAAAANWUtPMAAQAAAA4AAAAYAAAAAAACAAEAAwAEAAEABAAAAAIAAAABA/QB9AAFAAgCmQLMAAAAjwKZAswAAAHrADMBCQAAAgAGAwAAAAAAAAAAAAEQAAAAAAAAAAAAAABQZkVkAEAAeOYHA4D/gABcAxgAHwAAAAEAAAAAAAAAAAADAAAAAwAAABwAAQAAAAAATAADAAEAAAAcAAQAMAAAAAgACAACAAAAAAB45gf//wAAAAAAeOYH//8AAP+LGf0AAQAAAAAAAAAAAAABBgAAAQAAAAAAAAABAgAAAAIAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAUALP/hA7wDGAAWADAAOgBSAF4Bd0uwE1BYQEoCAQANDg0ADmYAAw4BDgNeAAEICAFcEAEJCAoGCV4RAQwGBAYMXgALBAtpDwEIAAYMCAZYAAoHBQIECwoEWRIBDg4NUQANDQoOQhtLsBdQWEBLAgEADQ4NAA5mAAMOAQ4DXgABCAgBXBABCQgKCAkKZhEBDAYEBgxeAAsEC2kPAQgABgwIBlgACgcFAgQLCgRZEgEODg1RAA0NCg5CG0uwGFBYQEwCAQANDg0ADmYAAw4BDgNeAAEICAFcEAEJCAoICQpmEQEMBgQGDARmAAsEC2kPAQgABgwIBlgACgcFAgQLCgRZEgEODg1RAA0NCg5CG0BOAgEADQ4NAA5mAAMOAQ4DAWYAAQgOAQhkEAEJCAoICQpmEQEMBgQGDARmAAsEC2kPAQgABgwIBlgACgcFAgQLCgRZEgEODg1RAA0NCg5CWVlZQChTUzs7MjEXF1NeU15bWDtSO1JLQzc1MToyOhcwFzBRETEYESgVQBMWKwEGKwEiDgIdASE1NCY1NC4CKwEVIQUVFBYUDgIjBiYrASchBysBIiciLgI9ARciBhQWMzI2NCYXBgcOAx4BOwYyNicuAScmJwE1ND4COwEyFh0BARkbGlMSJRwSA5ABChgnHoX+SgKiARUfIw4OHw4gLf5JLB0iFBkZIBMIdwwSEgwNEhKMCAYFCwQCBA8OJUNRUEAkFxYJBQkFBQb+pAUPGhW8HykCHwEMGScaTCkQHAQNIBsSYYg0Fzo6JRcJAQGAgAETGyAOpz8RGhERGhF8GhYTJA4QDQgYGg0jERMUAXfkCxgTDB0m4wAAAgBBAEEDvwJNABoAGwAcQBkbEAADAgABQAEBAAIAaAMBAgJfFRgREgQSKwExNjMxMhcBMRYUBzEGIicJATEGIicxJjQ3ATEByhYgIBYBchYWFkAW/sT+xBZAFhYWAXICNhYW/o4XPxYXFwE7/sUXFxY/FwFyAAAAAQAAAAEAANFssA1fDzz1AAsEAAAAAADVlLTzAAAAANWUtPMALP/hA78DGAAAAAgAAgAAAAAAAAABAAADGP/hAFwEAAAAAAADvwABAAAAAAAAAAAAAAAAAAAABQQAAAAAAAAAAVUAAAPpACwEAABBAAAAAAAAAAABPAF3AAEAAAAFAF8ABQAAAAAAAgAmADQAbAAAAIoJlgAAAAAAAAAMAJYAAQAAAAAAAQAIAAAAAQAAAAAAAgAGAAgAAQAAAAAAAwAkAA4AAQAAAAAABAAIADIAAQAAAAAABQBFADoAAQAAAAAABgAIAH8AAwABBAkAAQAQAIcAAwABBAkAAgAMAJcAAwABBAkAAwBIAKMAAwABBAkABAAQAOsAAwABBAkABQCKAPsAAwABBAkABgAQAYVpY29uZm9udE1lZGl1bUZvbnRGb3JnZSAyLjAgOiBpY29uZm9udCA6IDE5LTctMjAxN2ljb25mb250VmVyc2lvbiAxLjA7IHR0ZmF1dG9oaW50ICh2MC45NCkgLWwgOCAtciA1MCAtRyAyMDAgLXggMTQgLXcgIkciIC1mIC1zaWNvbmZvbnQAaQBjAG8AbgBmAG8AbgB0AE0AZQBkAGkAdQBtAEYAbwBuAHQARgBvAHIAZwBlACAAMgAuADAAIAA6ACAAaQBjAG8AbgBmAG8AbgB0ACAAOgAgADEAOQAtADcALQAyADAAMQA3AGkAYwBvAG4AZgBvAG4AdABWAGUAcgBzAGkAbwBuACAAMQAuADAAOwAgAHQAdABmAGEAdQB0AG8AaABpAG4AdAAgACgAdgAwAC4AOQA0ACkAIAAtAGwAIAA4ACAALQByACAANQAwACAALQBHACAAMgAwADAAIAAtAHgAIAAxADQAIAAtAHcAIAAiAEcAIgAgAC0AZgAgAC0AcwBpAGMAbwBuAGYAbwBuAHQAAAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABQAAAAEAAgBbAQIDZWVuAAEAAf//AA8AAAAAAAAAAAAAAAAAAAAAADIAMgMY/+EDGP/hAxj/4QMY/+GwACywIGBmLbABLCBkILDAULAEJlqwBEVbWCEjIRuKWCCwUFBYIbBAWRsgsDhQWCGwOFlZILAKRWFksChQWCGwCkUgsDBQWCGwMFkbILDAUFggZiCKimEgsApQWGAbILAgUFghsApgGyCwNlBYIbA2YBtgWVlZG7AAK1lZI7AAUFhlWVktsAIsIEUgsAQlYWQgsAVDUFiwBSNCsAYjQhshIVmwAWAtsAMsIyEjISBksQViQiCwBiNCsgoAAiohILAGQyCKIIqwACuxMAUlilFYYFAbYVJZWCNZISCwQFNYsAArGyGwQFkjsABQWGVZLbAELLAII0KwByNCsAAjQrAAQ7AHQ1FYsAhDK7IAAQBDYEKwFmUcWS2wBSywAEMgRSCwAkVjsAFFYmBELbAGLLAAQyBFILAAKyOxBAQlYCBFiiNhIGQgsCBQWCGwABuwMFBYsCAbsEBZWSOwAFBYZVmwAyUjYURELbAHLLEFBUWwAWFELbAILLABYCAgsApDSrAAUFggsAojQlmwC0NKsABSWCCwCyNCWS2wCSwguAQAYiC4BABjiiNhsAxDYCCKYCCwDCNCIy2wCixLVFixBwFEWSSwDWUjeC2wCyxLUVhLU1ixBwFEWRshWSSwE2UjeC2wDCyxAA1DVVixDQ1DsAFhQrAJK1mwAEOwAiVCsgABAENgQrEKAiVCsQsCJUKwARYjILADJVBYsABDsAQlQoqKIIojYbAIKiEjsAFhIIojYbAIKiEbsABDsAIlQrACJWGwCCohWbAKQ0ewC0NHYLCAYiCwAkVjsAFFYmCxAAATI0SwAUOwAD6yAQEBQ2BCLbANLLEABUVUWACwDSNCIGCwAWG1Dg4BAAwAQkKKYLEMBCuwaysbIlktsA4ssQANKy2wDyyxAQ0rLbAQLLECDSstsBEssQMNKy2wEiyxBA0rLbATLLEFDSstsBQssQYNKy2wFSyxBw0rLbAWLLEIDSstsBcssQkNKy2wGCywByuxAAVFVFgAsA0jQiBgsAFhtQ4OAQAMAEJCimCxDAQrsGsrGyJZLbAZLLEAGCstsBossQEYKy2wGyyxAhgrLbAcLLEDGCstsB0ssQQYKy2wHiyxBRgrLbAfLLEGGCstsCAssQcYKy2wISyxCBgrLbAiLLEJGCstsCMsIGCwDmAgQyOwAWBDsAIlsAIlUVgjIDywAWAjsBJlHBshIVktsCQssCMrsCMqLbAlLCAgRyAgsAJFY7ABRWJgI2E4IyCKVVggRyAgsAJFY7ABRWJgI2E4GyFZLbAmLLEABUVUWACwARawJSqwARUwGyJZLbAnLLAHK7EABUVUWACwARawJSqwARUwGyJZLbAoLCA1sAFgLbApLACwA0VjsAFFYrAAK7ACRWOwAUVisAArsAAWtAAAAAAARD4jOLEoARUqLbAqLCA8IEcgsAJFY7ABRWJgsABDYTgtsCssLhc8LbAsLCA8IEcgsAJFY7ABRWJgsABDYbABQ2M4LbAtLLECABYlIC4gR7AAI0KwAiVJiopHI0cjYSBYYhshWbABI0KyLAEBFRQqLbAuLLAAFrAEJbAEJUcjRyNhsAZFK2WKLiMgIDyKOC2wLyywABawBCWwBCUgLkcjRyNhILAEI0KwBkUrILBgUFggsEBRWLMCIAMgG7MCJgMaWUJCIyCwCUMgiiNHI0cjYSNGYLAEQ7CAYmAgsAArIIqKYSCwAkNgZCOwA0NhZFBYsAJDYRuwA0NgWbADJbCAYmEjICCwBCYjRmE4GyOwCUNGsAIlsAlDRyNHI2FgILAEQ7CAYmAjILAAKyOwBENgsAArsAUlYbAFJbCAYrAEJmEgsAQlYGQjsAMlYGRQWCEbIyFZIyAgsAQmI0ZhOFktsDAssAAWICAgsAUmIC5HI0cjYSM8OC2wMSywABYgsAkjQiAgIEYjR7AAKyNhOC2wMiywABawAyWwAiVHI0cjYbAAVFguIDwjIRuwAiWwAiVHI0cjYSCwBSWwBCVHI0cjYbAGJbAFJUmwAiVhsAFFYyMgWGIbIVljsAFFYmAjLiMgIDyKOCMhWS2wMyywABYgsAlDIC5HI0cjYSBgsCBgZrCAYiMgIDyKOC2wNCwjIC5GsAIlRlJYIDxZLrEkARQrLbA1LCMgLkawAiVGUFggPFkusSQBFCstsDYsIyAuRrACJUZSWCA8WSMgLkawAiVGUFggPFkusSQBFCstsDcssC4rIyAuRrACJUZSWCA8WS6xJAEUKy2wOCywLyuKICA8sAQjQoo4IyAuRrACJUZSWCA8WS6xJAEUK7AEQy6wJCstsDkssAAWsAQlsAQmIC5HI0cjYbAGRSsjIDwgLiM4sSQBFCstsDossQkEJUKwABawBCWwBCUgLkcjRyNhILAEI0KwBkUrILBgUFggsEBRWLMCIAMgG7MCJgMaWUJCIyBHsARDsIBiYCCwACsgiophILACQ2BkI7ADQ2FkUFiwAkNhG7ADQ2BZsAMlsIBiYbACJUZhOCMgPCM4GyEgIEYjR7AAKyNhOCFZsSQBFCstsDsssC4rLrEkARQrLbA8LLAvKyEjICA8sAQjQiM4sSQBFCuwBEMusCQrLbA9LLAAFSBHsAAjQrIAAQEVFBMusCoqLbA+LLAAFSBHsAAjQrIAAQEVFBMusCoqLbA/LLEAARQTsCsqLbBALLAtKi2wQSywABZFIyAuIEaKI2E4sSQBFCstsEIssAkjQrBBKy2wQyyyAAA6Ky2wRCyyAAE6Ky2wRSyyAQA6Ky2wRiyyAQE6Ky2wRyyyAAA7Ky2wSCyyAAE7Ky2wSSyyAQA7Ky2wSiyyAQE7Ky2wSyyyAAA3Ky2wTCyyAAE3Ky2wTSyyAQA3Ky2wTiyyAQE3Ky2wTyyyAAA5Ky2wUCyyAAE5Ky2wUSyyAQA5Ky2wUiyyAQE5Ky2wUyyyAAA8Ky2wVCyyAAE8Ky2wVSyyAQA8Ky2wViyyAQE8Ky2wVyyyAAA4Ky2wWCyyAAE4Ky2wWSyyAQA4Ky2wWiyyAQE4Ky2wWyywMCsusSQBFCstsFwssDArsDQrLbBdLLAwK7A1Ky2wXiywABawMCuwNistsF8ssDErLrEkARQrLbBgLLAxK7A0Ky2wYSywMSuwNSstsGIssDErsDYrLbBjLLAyKy6xJAEUKy2wZCywMiuwNCstsGUssDIrsDUrLbBmLLAyK7A2Ky2wZyywMysusSQBFCstsGgssDMrsDQrLbBpLLAzK7A1Ky2waiywMyuwNistsGssK7AIZbADJFB4sAEVMC0AAEu4AMhSWLEBAY5ZuQgACABjILABI0QgsAMjcLAORSAgS7gADlFLsAZTWliwNBuwKFlgZiCKVViwAiVhsAFFYyNisAIjRLMKCQUEK7MKCwUEK7MODwUEK1myBCgJRVJEswoNBgQrsQYBRLEkAYhRWLBAiFixBgNEsSYBiFFYuAQAiFixBgFEWVlZWbgB/4WwBI2xBQBEAAAA"},function(A,s){A.exports="data:application/font-woff;base64,d09GRgABAAAAAAvMABAAAAAAE0wAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAABbAAAABoAAAAcd2cMtkdERUYAAAGIAAAAHAAAACAAMgAET1MvMgAAAaQAAABHAAAAVlbzWKZjbWFwAAAB7AAAAEcAAAFSAI3s2mN2dCAAAAI0AAAAFAAAACQMlf+2ZnBnbQAAAkgAAAT8AAAJljD3npVnYXNwAAAHRAAAAAgAAAAIAAAAEGdseWYAAAdMAAAB+AAAAvDjDPovaGVhZAAACUQAAAAwAAAANg5GrdxoaGVhAAAJdAAAAB0AAAAkBzQD52htdHgAAAmUAAAAFAAAABQNPgBubG9jYQAACagAAAAMAAAADAE8AXhtYXhwAAAJtAAAACAAAAAgAScCDG5hbWUAAAnUAAABQwAAAj0mScBUcG9zdAAACxgAAAAaAAAAMAPIZnJwcmVwAAALNAAAAJUAAACVpbm+ZnicY2BgYGQAgjO2i86D6KtTtnyG0QBVJQicAAB4nGNgZGBg4ANiCQYQYGJgBEIWMAbxGAAEdgA3eJxjYGT+wviFgZWBg2km0xkGBoZ+CM34msGYkZOBgYmBjZkBBhgFGBAgIM01hcGBoeIZO3PD/waGGGYJBnmQGpAcAEaJDD4AeJxjYGBgZoBgGQZGBhDwAfIYwXwWBgMgzQGETGCZimfs//8js/53S/6F6gIDRjYGOJcRpIeJARUwMtAMMNPOaJIAAHgwCk4AeJxjYEADRgxGzBL/HyJjAEOACFF4nJ1VaXfTRhSVvGRP2pLEUETbMROnNBqZsAUDLgQpsgvp4kBoJegiJzFd+AN87Gf9mqfQntOP/LTeO14SWnpO2xxL776ZO2/TexNxjKjseSCuUUdKXveksv5UKvGzpK7rXp4o6fWSumynnpIWUStNlczF/SO5RHUuVrJJsEnG616inqs874PSSzKsKEsi2iLayrwsTVNPHD9NtTi9ZJCmgZSMgp1Ko48QqlEvkaoOZUqHXr2eipsFUjYa8aijonoQKu4czzmljTpgpHKVw1yxWW3ke0nW8/qP0kSn2Nt+nGDDY/QjV4FUjMzA9jQeh08k09FeIjORf+y4TpSFUhtcAK9qsMegSvGhuPFBthPI1HjN8XVRqTQyFee6z7LZLB2PlRDlwd/YoZQbur+Ds9OmqFZjcfvAMwY5KZQoekgWgA5Tmaf2CNo8tEBmjfqj4hzwdQgvshBlKs+ULOhQBzJndveTYtrdSddkcaBfBjJvdveS3cfDRa+O9WW7vmAKZzF6khSLixHchzLrp0y71AhHGRdzwMU8XuLWtELIyAKMSiPMUVv4ntmoa5wdY290Ho/VU2TSRfzdTH49OKlY4TjLekfcSJy7x67rwlUgiwinGu8njizqUGWw+vvSkussOGGYZ8VCxZcXvncR+S8xbj+Qd0zhUr5rihLle6YoU54xRYVyGYWlXDHFFOWqKaYpa6aYoTxrilnKc0am/X/p+334Pocz5+Gb0oNvygvwTfkBfFN+CN+UH8E3pYJvyjp8U16Eb0pt4G0pUxGqmLF0+O0lWrWhajkzuMA+D2TNiPZFbwTSMEp11Ukpdb+lVf4k+euix2Prk5K6NWlsiLu6abP4+HTGb25dMuqGnatPjCPloT109dg0oVP7zeHfzl3dKi65q4hqw6g2IpgEgDbotwLxTfNsOxDzll18/EMwAtTPqTVUU3Xt1JUaD/K8q7sYnuTA44hjoI3rrq7ASxNTVkPz4WcpMhX7g7yplWrnsHX5ZFs1hzakwtsi9pVknKbtveRVSZWV96q0Xj6fhiF6ehbXhLZs3cmkEqFRM87x8K4qRdmRlnLUP0Lnl6K+B5xxdkHrwzHuRN1BtTXsdPj5ZiNrCyaGprS9E6BkLF0VY1HlWZxjdA1rHW/cEp6upycW8Sk2mY/CSnV9lI9uI80rdllm0ahKdXSX9lnsqzb9MjtoWB1nP2mqNu7qYVuNKlI9Vb4GtAd2Vt34UA8rPuqgUVU12+jayGM0LmvGfwzIYlz560arJtPv4JZqp81izV1Bc9+YLPdOL2+9yX4r56aRpv9Woy0jl/0cjvltEeDfOSh2U9ZAvTVpiHEB2QsYLtVE5w7N3cYg4jr7H53T/W/NwiA5q22N2Tz14erpKJI7THmcZZtZ1vUozVG0k8Q+RWKrw4nBTY3hWG7KBgbk7j+s38M94K4siw+8bSSAuM/axKie6uDuHlcjNOwruQ8YmWPHuQ2wA+ASxObYtSsdALvSJecOwGfkEDwgh+AhOQS75NwE+Jwcgi/IIfiSHIKvyLkF0COHYI8cgkfkEDwmpw2wTw7BE3IIviaH4BtyWgAJOQQpOQRPySF4ZmRzUuZvqch1oO8sugH0ve0aKFtQfjByZcLOqFh23yKyDywi9dDI1Qn1iIqlDiwi9blFpP5o5NqE+hMVS/3ZIlJ/sYjUF8aXmYGU13oveUcHfwIrvqx+AAEAAf//AA94nJ3Mv27TUBQG8HOu7Rs7sW9iO7nXcZLmX2O3Soni1EmlWFDTTm0i1CRLIlAQEopg7ZKFoQsSA0I8A0Ji7QNUTGXhLRA8h8GsDKggHX1HR+fTDxQ4+PlNupEc4NCHMcxhjdvJtX2xjM8JgsEMYBuQGDJpDaiq+KSAmpql2tpEncpUX0NOzr3MowpUV+kSshmFyLmsvLKQMWMGhpFlJ5XJtUjFyV9EVctu/pF0UnJ6N1Le3MmMH/3B4Sb1GKrP/w9crVbx3mIRRYNAiMV6sX68jObRfHJ6NAzGg7Hoi/7MDBxzrxTbvIu0iy1Gatgcht4w7JEulppKqciLjLSp10W/mUkbfqtH7qNo0SI/HIxCT9AMk3YwooOR30Pf83EYPiARDngNsVxxF1anaknvMev4O6+Tc/IBS/U2Y3XWuJecHdRaxXK5Yatb3bJ0w7LeqlTJyUTOs87p7CLeFVxTNEWhyUcl75Zu6vukjnrZd6f7hapsNCrWszehGI87QkO8ukK70mCfjk3XTOeVy+1dVjBUxzXapl3E7Y+cY+s17zsAgRN4KH0mU3ChAtW4XCmARABjxPT3QkJCnpYc05KtLgajw2AgMODFTEBbvoa/M/DCIwzwK280OF5yzmOe3Ca36eLpTUacJ+/EMRcCo+SLEPxY4CXAL7/YYc94nGNgZGBgAOK1Qovmx/PbfGWQZ2EAgatTtnyG0zr/HzLvY5YAcjkYmECiAGASDNd4nGNgZGBglvj/kCGGhQEEmPcxMDKgAlYAU3YDJAAAAAQAAAAAAAAAAVUAAAPpACwEAABCAAAAAAAAAAABPAF4AAEAAAAFAF8ABQAAAAAAAgAmADQAbAAAAIoBdwAAAAB4nH2Qu26DQBBFL37JkVJYadOMUAq7WLQgLL/qQJq06S0bbCQHJMAP5ROi1CmTb0ibr/NlvWlSGLSzZ3YvM3cAcItPOGgeB33cWW6hh5HlNh7wZrlDzY/lLh6dyHIPfeeLSqdzw5OB+arhFuvfW27jCdpyh5pvy12849dyDwPnAxlWKJAjNbEGslWRp0VOekaCNQV7vDJJ1tmee2R1zV5iQ4kggMdugjnX/3qXUx8zKEy4Aip9EiL2iIpyk0jgaZnLX1+iP1MTFWifqiv2Xti7REVJc9X0aFwsSDXfFEsar3m3peLiZIgDFR69hPzjQjc7xqmhknFsplCIzUzaZidTOzR8ZHR575osNbGilaSssiIX39MLqet0ua+LbcZZhgftzcKRqJ1MRZUy1qJiCTS3k/ihqKO4sSsqFVVdG/YMMQJZOQB4nGNgYsAPWIGYkYGJIZqRiTk1NQ8ABfYBpAAAS7gAyFJYsQEBjlm5CAAIAGMgsAEjRCCwAyNwsA5FICBLuAAOUUuwBlNaWLA0G7AoWWBmIIpVWLACJWGwAUVjI2KwAiNEswoJBQQrswoLBQQrsw4PBQQrWbIEKAlFUkSzCg0GBCuxBgFEsSQBiFFYsECIWLEGA0SxJgGIUVi4BACIWLEGAURZWVlZuAH/hbAEjbEFAEQAAAA="},function(A,s){A.exports=function(A,s,t,n,e){var i,o=A=A||{},r=typeof A.default;"object"!==r&&"function"!==r||(i=A,o=A.default);var B="function"==typeof o?o.options:o;s&&(B.render=s.render,B.staticRenderFns=s.staticRenderFns),n&&(B._scopeId=n);var w;if(e?(w=function(A){A=A||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,A||"undefined"==typeof __VUE_SSR_CONTEXT__||(A=__VUE_SSR_CONTEXT__),t&&t.call(this,A),A&&A._registeredComponents&&A._registeredComponents.add(e)},B._ssrRegister=w):t&&(w=t),w){var g=B.functional,C=g?B.render:B.beforeCreate;g?B.render=function(A,s){return w.call(s),C(A,s)}:B.beforeCreate=C?[].concat(C,w):[w]}return{esModule:i,exports:o,options:B}}},function(A,s,t){A.exports={render:function(){var A=this,s=A.$createElement,t=A._self._c||s;return t("div",{class:A.classes,style:A.styles,on:{click:A.back,mouseenter:A.showNav,mouseleave:A.hideNav}},[A._t("default",[t("div",{class:A.innerClasses},[t("i",{staticClass:"vm-backtop-icon-een"})])]),A._v(" "),t("div",{directives:[{name:"show",rawName:"v-show",value:A.navShow,expression:"navShow"}],class:A.nav},A._l(A.options,function(s){return t("div",{class:A.navItem,on:{click:function(t){t.stopPropagation(),A.handleNavClick(s.id)}}},[A._v(A._s(s.label))])}))],2)},staticRenderFns:[]},A.exports.render._withStripped=!0},function(s,t){s.exports=A}])});


--------------------------------------------------------------------------------
/lib/vm-font.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" standalone="no"?>
 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
 3 | <svg xmlns="http://www.w3.org/2000/svg">
 4 | <metadata>
 5 | Created by FontForge 20120731 at Wed Jul 19 15:04:19 2017
 6 |  By admin
 7 | </metadata>
 8 | <defs>
 9 | <font id="iconfont" horiz-adv-x="1024" >
10 |   <font-face 
11 |     font-family="iconfont"
12 |     font-weight="500"
13 |     font-stretch="normal"
14 |     units-per-em="1024"
15 |     panose-1="2 0 6 3 0 0 0 0 0 0"
16 |     ascent="896"
17 |     descent="-128"
18 |     x-height="792"
19 |     bbox="44 -31 958 792"
20 |     underline-thickness="0"
21 |     underline-position="0"
22 |     unicode-range="U+0078-E607"
23 |   />
24 | <missing-glyph 
25 |  />
26 |     <glyph glyph-name=".notdef" 
27 |  />
28 |     <glyph glyph-name=".notdef" 
29 |  />
30 |     <glyph glyph-name=".null" horiz-adv-x="0" 
31 |  />
32 |     <glyph glyph-name="nonmarkingreturn" horiz-adv-x="341" 
33 |  />
34 |     <glyph glyph-name="x" unicode="x" horiz-adv-x="1001" 
35 | d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
36 | t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
37 | t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
38 |     <glyph glyph-name="een" unicode="&#xe607;" 
39 | d="M458 566v0q22 22 54 22v0q32 0 54 -22l370 -370v0q22 -23 22 -54.5t-22 -53.5v0q-22 -23 -54 -23t-54 23l-316 315l-316 -315v0q-22 -23 -54 -23t-54 23v0q-22 22 -22 53.5t22 54.5l370 370v0zM458 566z" />
40 |   </font>
41 | </defs></svg>
42 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "vue-multiple-back-top",
 3 |   "description": "Vue-based back-top component",
 4 |   "version": "1.0.2",
 5 |   "author": "vue-multiple",
 6 |   "main": "lib/back-top.js",
 7 |   "files": [
 8 |     "lib",
 9 |     "build",
10 |     "example",
11 |     "src"
12 |   ],
13 |   "scripts": {
14 |     "build": "rm -rf ./lib && webpack --config ./build/webpack.config.js --progress --hide-modules",
15 |     "demo:dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot --config ./build/webpack.example.dev.conf.js",
16 |     "demo:build": "rm -rf ./example/dist && cross-env NODE_ENV=production webpack --config ./build/webpack.example.prod.conf.js",
17 |     "demo:prepublish": "rm -rf ./gh-pages && cross-env NODE_ENV=prepublish webpack --config ./build/webpack.example.prod.conf.js",
18 |     "deploy": "bash ./build/gh-pages.sh"
19 |   },
20 |   "repository": {
21 |     "type": "git",
22 |     "url": "git@github.com:vue-multiple/back-top.git"
23 |   },
24 |   "keywords": [
25 |     "vue",
26 |     "back-top",
27 |     "backtop",
28 |     "back-to-top",
29 |     "components"
30 |   ],
31 |   "license": "MIT",
32 |   "bugs": {
33 |     "url": "https://github.com/vue-multiple/back-top/issues"
34 |   },
35 |   "unpkg": "lib/back-top.js",
36 |   "dependencies": {
37 |     "vue": "^2.3.3"
38 |   },
39 |   "devDependencies": {
40 |     "autoprefixer-loader": "^3.2.0",
41 |     "babel-core": "^6.0.0",
42 |     "babel-loader": "^6.0.0",
43 |     "babel-plugin-component": "^0.9.1",
44 |     "babel-preset-env": "^1.5.1",
45 |     "cross-env": "^5.0.0",
46 |     "css-loader": "^0.28.4",
47 |     "extract-text-webpack-plugin": "^2.1.0",
48 |     "file-loader": "^0.9.0",
49 |     "friendly-errors-webpack-plugin": "^1.6.1",
50 |     "html-webpack-plugin": "^2.28.0",
51 |     "less": "^2.7.2",
52 |     "less-loader": "^4.0.5",
53 |     "style-loader": "^0.18.2",
54 |     "url-loader": "^0.5.8",
55 |     "vue-highlightjs": "^1.3.3",
56 |     "vue-loader": "^12.1.0",
57 |     "vue-style-loader": "^3.0.1",
58 |     "vue-template-compiler": "^2.3.3",
59 |     "webpack": "^2.6.1",
60 |     "webpack-dev-server": "^2.4.5",
61 |     "webpack-hot-middleware": "^2.18.0",
62 |     "webpack-merge": "^4.1.0"
63 |   }
64 | }
65 | 


--------------------------------------------------------------------------------
/src/components/back-top.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |     <div :class="classes" :style="styles" @click="back" @mouseenter="showNav" @mouseleave="hideNav">
  3 |         <slot>
  4 |             <div :class="innerClasses">
  5 |                 <i class="vm-backtop-icon-een"></i>
  6 |             </div>
  7 |         </slot>
  8 |         <div v-show="navShow" :class="nav">
  9 |             <div :class="navItem" v-for="item in options" @click.stop="handleNavClick(item.id)">{{ item.label }}</div>
 10 |         </div>
 11 |     </div>
 12 | </template>
 13 | 
 14 | <script>
 15 |     import { scrollTop } from '../utils/assist';
 16 |     import { on, off, getAbsPoint } from '../utils/dom';
 17 |     const prefixCls = 'vm-back-top'
 18 | 
 19 |     export default{
 20 |         name: 'VmBackTop',
 21 |         componentName: 'VmBackTop',
 22 |         data(){
 23 |             return {
 24 |                 backTop: false,
 25 |                 navShow:false
 26 |             }
 27 |         },
 28 |         props: {
 29 |             height: {
 30 |                 type: Number,
 31 |                 default: 400
 32 |             },
 33 |             bottom: {
 34 |                 type: Number,
 35 |                 default: 30
 36 |             },
 37 |             right: {
 38 |                 type: Number,
 39 |                 default: 30
 40 |             },
 41 |             duration: {
 42 |                 type: Number,
 43 |                 default: 1000
 44 |             },
 45 |             timing: {
 46 |                 type: String,
 47 |                 default: 'linear'
 48 |             },
 49 |             options:{
 50 |                 type: Array,
 51 |                 default: () => {
 52 |                     return []
 53 |                 }
 54 |             },
 55 |             navItemClass: {
 56 |                 type: String,
 57 |                 default: ''
 58 |             }
 59 |         },
 60 |         mounted (){
 61 |             on(window, 'scroll', this.handleScroll);
 62 |             on(window, 'resize', this.handleScroll);
 63 |         },
 64 |         beforeDestroy () {
 65 |             off(window, 'scroll', this.handleScroll);
 66 |             off(window, 'resize', this.handleScroll);
 67 |         },
 68 |         computed: {
 69 |             classes () {
 70 |                 return [
 71 |                     `${prefixCls}`,
 72 |                     {
 73 |                         [`${prefixCls}-show`]: this.backTop
 74 |                     }
 75 |                 ];
 76 |             },
 77 |             styles () {
 78 |                 return {
 79 |                     bottom: `${this.bottom}px`,
 80 |                     right: `${this.right}px`
 81 |                 };
 82 |             },
 83 |             innerClasses () {
 84 |                 return `${prefixCls}-inner`;
 85 |             },
 86 |             nav () {
 87 |                 return [
 88 |                     `${prefixCls}-nav`
 89 |                 ];
 90 |             },
 91 |             navItem () {
 92 |                 return [
 93 |                     `${prefixCls}-nav-item`,
 94 |                     `${this.navItemClass}`
 95 |                 ];
 96 |             }
 97 |         },
 98 |         methods: {
 99 |             handleScroll () {
100 |                 this.backTop = window.pageYOffset >= this.height;
101 |             },
102 |             back () {
103 |                 const sTop = document.documentElement.scrollTop || document.body.scrollTop;
104 |                 scrollTop(window, sTop, 0, this.duration, this.timing);
105 |                 this.$emit('click');
106 |             },
107 |             showNav (){
108 |                 this.navShow = true
109 |             },
110 |             hideNav (){
111 |                 this.navShow = false
112 |             },
113 |             handleNavClick (id){
114 |                 const sTop = document.documentElement.scrollTop || document.body.scrollTop;
115 |                 var targetTop = getAbsPoint(document.getElementById(id)).y
116 |                 scrollTop(window, sTop, targetTop, this.duration, this.timing);
117 |                 this.$emit('navClick',id);
118 |             }
119 |         }
120 |     }
121 | </script>
122 | 
123 | 


--------------------------------------------------------------------------------
/src/fonts/vm-font.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/vue-multiple/back-top/e3a194f39aa33d4242d3b76ce7bdaef75f6283c1/src/fonts/vm-font.eot


--------------------------------------------------------------------------------
/src/fonts/vm-font.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" standalone="no"?>
 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
 3 | <svg xmlns="http://www.w3.org/2000/svg">
 4 | <metadata>
 5 | Created by FontForge 20120731 at Wed Jul 19 15:04:19 2017
 6 |  By admin
 7 | </metadata>
 8 | <defs>
 9 | <font id="iconfont" horiz-adv-x="1024" >
10 |   <font-face 
11 |     font-family="iconfont"
12 |     font-weight="500"
13 |     font-stretch="normal"
14 |     units-per-em="1024"
15 |     panose-1="2 0 6 3 0 0 0 0 0 0"
16 |     ascent="896"
17 |     descent="-128"
18 |     x-height="792"
19 |     bbox="44 -31 958 792"
20 |     underline-thickness="0"
21 |     underline-position="0"
22 |     unicode-range="U+0078-E607"
23 |   />
24 | <missing-glyph 
25 |  />
26 |     <glyph glyph-name=".notdef" 
27 |  />
28 |     <glyph glyph-name=".notdef" 
29 |  />
30 |     <glyph glyph-name=".null" horiz-adv-x="0" 
31 |  />
32 |     <glyph glyph-name="nonmarkingreturn" horiz-adv-x="341" 
33 |  />
34 |     <glyph glyph-name="x" unicode="x" horiz-adv-x="1001" 
35 | d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
36 | t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
37 | t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
38 |     <glyph glyph-name="een" unicode="&#xe607;" 
39 | d="M458 566v0q22 22 54 22v0q32 0 54 -22l370 -370v0q22 -23 22 -54.5t-22 -53.5v0q-22 -23 -54 -23t-54 23l-316 315l-316 -315v0q-22 -23 -54 -23t-54 23v0q-22 22 -22 53.5t22 54.5l370 370v0zM458 566z" />
40 |   </font>
41 | </defs></svg>
42 | 


--------------------------------------------------------------------------------
/src/fonts/vm-font.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/vue-multiple/back-top/e3a194f39aa33d4242d3b76ce7bdaef75f6283c1/src/fonts/vm-font.ttf


--------------------------------------------------------------------------------
/src/fonts/vm-font.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/vue-multiple/back-top/e3a194f39aa33d4242d3b76ce7bdaef75f6283c1/src/fonts/vm-font.woff


--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | import BackTop from './components/back-top.vue'
2 | import './styles/less/index.less'
3 | 
4 | export default BackTop


--------------------------------------------------------------------------------
/src/styles/less/back-top.less:
--------------------------------------------------------------------------------
 1 | @backtop-prefix-cls: ~"@{vm-prefix}back-top";
 2 | 
 3 | .@{backtop-prefix-cls} {
 4 |     z-index: @zindex-back-top;
 5 |     position: fixed;
 6 |     cursor: pointer;
 7 |     display: none;
 8 | 
 9 |     &.@{backtop-prefix-cls}-show {
10 |         display: block;
11 |     }
12 | 
13 |     &-inner {
14 |         background-color: rgba(0,0,0,.6);
15 |         border-radius: 2px;
16 |         box-shadow: 0 1px 3px rgba(0,0,0,.2);
17 |         transition: all @transition-time @ease-in-out;
18 | 
19 |         &:hover {
20 |             background-color: rgba(0,0,0,.7);
21 |         }
22 |     }
23 | 
24 |     i{
25 |         color: #fff;
26 |         font-size: 24px;
27 |         padding: 8.5px 10px;
28 |     }
29 |     &-nav {
30 |         position: absolute;
31 |         right: 100%;
32 |         bottom:0;
33 |         border-radius: 3px;
34 |         overflow: hidden;
35 |         &-item{
36 |             height: 30px;
37 |             line-height: 30px;
38 |             text-align: left;
39 |             background-color: rgba(0,0,0,.6);
40 |             color: #fff;
41 |             padding: 2px 10px;
42 |             white-space: nowrap;
43 |             &:hover {
44 |                 background-color: rgba(0,0,0,.7);
45 |             }
46 |         }
47 |     }
48 | }
49 | 


--------------------------------------------------------------------------------
/src/styles/less/base.less:
--------------------------------------------------------------------------------
 1 | // Prefix
 2 | @vm-prefix: "vm-";
 3 | @icomoon-font-path: "../../fonts";
 4 | 
 5 | // Z-index
 6 | @zindex-back-top: 10;
 7 | 
 8 | // Animation
 9 | @animation-time: .3s;
10 | @transition-time: .2s;
11 | @ease-in-out: ease-in-out;


--------------------------------------------------------------------------------
/src/styles/less/font.less:
--------------------------------------------------------------------------------
 1 | @font-face {font-family: "vm-backtop-font";
 2 |   src: url('@{icomoon-font-path}/vm-font.eot?t=1500447860026'); /* IE9*/
 3 |   src: url('@{icomoon-font-path}/vm-font.eot?t=1500447860026#iefix') format('embedded-opentype'), /* IE6-IE8 */
 4 |   url('@{icomoon-font-path}/vm-font.woff?t=1500447860026') format('woff'), /* chrome, firefox */
 5 |   url('@{icomoon-font-path}/vm-font.ttf?t=1500447860026') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
 6 |   url('@{icomoon-font-path}/vm-font.svg?t=1500447860026#iconfont') format('svg'); /* iOS 4.1- */
 7 | }
 8 | 
 9 | .vm-backtop-icon-een {
10 |   display: inline-block;
11 |   font-family:"vm-backtop-font" !important;
12 |   font-size:16px;
13 |   font-style:normal;
14 |   -webkit-font-smoothing: antialiased;
15 |   -moz-osx-font-smoothing: grayscale;
16 | }
17 | 
18 | .vm-backtop-icon-een:before { content: "\e607"; }
19 | 


--------------------------------------------------------------------------------
/src/styles/less/index.less:
--------------------------------------------------------------------------------
1 | @import "./base.less";
2 | @import "./font.less";
3 | @import "./back-top.less";


--------------------------------------------------------------------------------
/src/utils/assist.js:
--------------------------------------------------------------------------------
 1 | // scrollTop animation
 2 | export function scrollTop(el, from = 0, to, duration = 500, timing = 'linear') {
 3 |     if (!window.requestAnimationFrame) {
 4 |         window.requestAnimationFrame = (
 5 |             window.webkitRequestAnimationFrame ||
 6 |             window.mozRequestAnimationFrame ||
 7 |             window.msRequestAnimationFrame ||
 8 |             function (callback) {
 9 |                 return window.setTimeout(callback, 1000 / 60);
10 |             }
11 |         );
12 |     }
13 |     const difference = Math.abs(from - to);
14 |     const step = Math.ceil(difference / (duration*60 / 1000));
15 |     const scale = 1/(1 - Math.pow(10/difference,1/(60*duration/1000 -10)));
16 | 
17 |     function scrollLinear(start, end, step) {
18 |         if (start === end) return;
19 |         let d = (start + step > end) ? end : start + step;
20 | 
21 |         if (start > end) {
22 |             d = (start - step < end) ? end : start - step;
23 |         }
24 | 
25 |         if (el === window) {
26 |             window.scrollTo(d, d);
27 |         } else {
28 |             el.scrollTop = d;
29 |         }
30 |         window.requestAnimationFrame(() => scrollLinear(d, end, step));
31 |     }
32 | 
33 |     function scrollEase(start, end) {
34 |         if (start === end) return;
35 |         let stepNum =  Math.ceil(Math.abs(start - end) / scale);
36 |         stepNum = stepNum > 0 ? Math.ceil(stepNum) : Math.floor(stepNum);
37 | 
38 |         let d = (start + stepNum > end) ? end : start + stepNum;
39 | 
40 |         if (start > end) {
41 |             d = (start - stepNum < end) ? end : start - stepNum;
42 |         }
43 |         if (el === window) {
44 |             window.scrollTo(d, d);
45 |         } else {
46 |             el.scrollTop = d;
47 |         }
48 |         window.requestAnimationFrame(() => scrollEase(d, end));
49 |     }
50 | 
51 |     if (timing === 'ease') {
52 |         scrollEase(from, to)
53 |     } else {
54 |         scrollLinear(from, to, step);
55 |     }
56 | 
57 | }


--------------------------------------------------------------------------------
/src/utils/dom.js:
--------------------------------------------------------------------------------
 1 | import Vue from 'vue';
 2 | const isServer = Vue.prototype.$isServer;
 3 | 
 4 | export const on = (function() {
 5 |     if (!isServer && document.addEventListener) {
 6 |         return function(element, event, handler) {
 7 |             if (element && event && handler) {
 8 |                 element.addEventListener(event, handler, false);
 9 |             }
10 |         };
11 |     } else {
12 |         return function(element, event, handler) {
13 |             if (element && event && handler) {
14 |                 element.attachEvent('on' + event, handler);
15 |             }
16 |         };
17 |     }
18 | })();
19 | 
20 | export const off = (function() {
21 |     if (!isServer && document.removeEventListener) {
22 |         return function(element, event, handler) {
23 |             if (element && event) {
24 |                 element.removeEventListener(event, handler, false);
25 |             }
26 |         };
27 |     } else {
28 |         return function(element, event, handler) {
29 |             if (element && event) {
30 |                 element.detachEvent('on' + event, handler);
31 |             }
32 |         };
33 |     }
34 | })();
35 | 
36 | export const getAbsPoint = e => {
37 |     var x = e.offsetLeft;
38 |     var y = e.offsetTop;
39 |     while(e = e.offsetParent)
40 |     {
41 |         x += e.offsetLeft;
42 |         y += e.offsetTop;
43 |     }
44 |     return {'x': x, 'y': y};
45 | };
46 | 


--------------------------------------------------------------------------------