Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

yokiyokiyoki/vue-fullpage

Open more actions menu

Repository files navigation

vue-fullpage

image image

A Vue.js components

Install

$ npm install v-fullpage

Usage

import Vue from "vue";
import fullpage from "v-fullpage";

Vue.use(fullpage);

or

<script src="vue.min.js"></script>
<!-- use vue2 -->
<!-- <script src="https://cdn.bootcss.com/vue/2.2.1/vue.js"></script> -->
<!-- must place this line after vue.js -->
<script src="v-fullpage.umd.min.js"></script>
<!-- download -->
<!-- <script src="https://github.com/yokiyokiyoki/vue-fullpage/blob/master/dist/v-fullpage.umd.min.js"></script> -->

Demo

<!-- default -->
<!-- 依赖于父级元素的大小,占满父级元素 -->
<v-fullpage>
  <div slot="section"></div>
  <div slot="section"></div>
</v-fullpage>

Options

Property Description Type Default
direction 滚动方向('vertical'或'horizontal') String 'vertical'

Callback

Name Description
leaveSlide 滑动之后,参数是当前 index

api

通过 ref 调用组件内部 api

Name Description
setAllowScrolling 传入 true/false,禁止滚动/开放滚动事件
move 传入 index,移动到 index 页面

License

MIT

About

🐟基于vue的页面滚动组件

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published
Morty Proxy This is a proxified and sanitized view of the page, visit original site.