nuxt-fullpage is a nuxt module for creating fullscreen page scroll fast and simple.

Overview

Nuxt fullpage

Nuxt module for creating fullscreen page scroll fast and simple.

Table of contents

  1. Installation
  2. Usage
  3. Options
  4. Contributing

Installation

Terminal:

// With npm

npm install --save @openafg/nuxt-fullpage

Usage

Add @openafg/nuxt-fullpage to the Modules section of nuxt.config.js

export default {
  modules: [
    ['@openafg/nuxt-fullpage', {
      // Options
    }]
  ]
}

Required HTML

This wrapper creates a <full-page> component, which you can use like other Vue.js components. For example:

<div>
    <full-page>
      <section class="section">
        First section ...
      </section>
      <section class="section">
        Second section ...
      </section>
  </full-page>
</div>

Options

To configure the module, in nuxt.config.js.

export default {
  modules: [
    ['@openafg/nuxt-fullpage', {
      activeSection: 0,
      mouseWheelSensitivity: 120,
      showIndicators: false
    }]
  ]
}

Contributing

You might also like...
Lightweight package for highlighting menu items as you scroll the page, also scrolling to target section when item clicked. Use as a vue component/directive or in vanilla js.

navscroll-js Installation This package is available on npm. Using npm: npm install --save navscroll Using yarn: yarn add navscroll Directly include it

πŸŽ‰ Page scroll progress bar component for @vuejs
πŸŽ‰ Page scroll progress bar component for @vuejs

vue-scroll-progress πŸŽ‰ Simple Vue.js plugin for page scroll progress bar Live Demo Installation npm i vue-scroll-progress --save yarn add vue-scroll-p

Vue.js plugin for page scroll progress bar

vue-scroll-progress-bar Getting started Install $ npm install @guillaumebriday/vue-scroll-progress-bar --save or $ yarn add @guillaumebriday/vue-scrol

Scroll to page top button, Vue.js component.

vue-go-top Scroll to page top button, Vue.js component. Demo Demo Install Browser script src="vue.js"/script script src="vue-go-top.min.js"/scr

A Back-to-top component for Vue.js, which scroll page to the top when clicked

Vue Backtotop Component A Back-to-top component for Vue.js, which scroll page to the top when clicked Demo See demo. Install via npm npm install vue-b

Vue.js plugin for page scroll progress bar

vue-scroll-progress-bar Getting started Install $ npm install @guillaumebriday/vue-scroll-progress-bar --save or $ yarn add @guillaumebriday/vue-scrol

↕ A simple but fast & powerful library to animate HTML elements while scrolling pages.

Vue Scroll Animator ↕ A simple but fast & powerful library to animate HTML elements while scrolling pages. Installation npm install @byloth/vue-scroll

A minimal, super simple browser scroll library with a convenient set of easy-to-use listeners and animate methods

vert (beta) A minimal, super simple browser scroll library with a convenient set of easy-to-use listeners and animate methods. Vert is optimized using

A simple scroll picker plugin for Vue 3

vue3-scroll-picker Vue 3 scroll picker plugin. Demo Demo Demo Code Install yarn add vue3-scroll-picker npm i --save vue3-scroll-picker Register Global

Comments
  • Create a button to go to slide xx

    Create a button to go to slide xx

    Hello, I have used your plugin in my project but how I can create a button that will navigate to a specific slide? I have tried using id in HTML, but it ended up can't do scrolling after clicking the button

    opened by RSurya99 0
Releases(v1.0.5)
Owner
Open Source Afghanistan
Open-source community in Afghanistan.
Open Source Afghanistan
Vue plugin that provides functionality for remembering scroll position and loaded items in a catalog page after navigating back and forth to a single item page, with customisable options.

Vue plugin that provides functionality for remembering scroll position and loaded items in a catalog page after navigating back and forth to a single item page, with customisable options.

Giorgos Sideris 3 Aug 1, 2022
Vue-slidePage is a fullscreen scrolling component of Vue.js, Based on slidePage

vue-slidePage Introduction vue-slidePage is a fullscreen scrolling component of Vue.js, Based on slidePage Demo simple custom Usage Install $ npm i -S

null 16 Nov 12, 2021
Lightweight and simple to use vue component that highlights menu items as you scroll the page, also scrolling to target section when clicked.

vue-scrollactive This component makes it simple to highlight a menu item with an 'active' class as you scroll. Highlights items with a class as you sc

Mauricio Farias Dziedzinski 533 Nov 20, 2022
Lightweight and simple to use vue component that highlights menu items as you scroll the page, also scrolling to target section when clicked.

vue-scrollactive This component makes it simple to highlight a menu item with an 'active' class as you scroll. Highlights items with a class as you sc

Mauricio Farias Dziedzinski 533 Nov 20, 2022
Very simple page top scroll seek bar with Vue.js

Very simple page top scroll seek bar with Vue.js

Akira Kanno 0 Nov 21, 2021
A vue directive to make a scrollable element scroll by draging to the scroll direction

vue-dragscroll vue-dragscroll is a micro vue.js directive which enables scrolling via holding the mouse button ("drag and drop" or "click and hold" st

null 229 Nov 16, 2022
Vue Scroll Show - Showing the element if the user reached it after scroll

Vue Scroll Show Showing the element if the user reached it after scroll Installation npm i --save-dev vue-scroll-show import VueScrollShow from 'vue-s

Aleksey Pleshkov 10 Jan 5, 2022
A sigle-page scroll plugin based on [email protected],support for mobile and PC .

fullpage-vue A sigle-page scroll plugin based on [email protected],support for mobile and PC . δΈ­ζ–‡η‰ˆ overview To achieve sigle-page scroll in mobile, support hori

abelTO 155 Oct 19, 2022
Vue.js plugin for page scroll progress bar

vue-scroll-progress-bar Getting started Install $ npm install @guillaumebriday/vue-scroll-progress-bar --save or $ yarn add @guillaumebriday/vue-scrol

Guillaume Briday 84 Nov 24, 2022
A Back-to-top component for Vue.js, which scroll page to the top when clicked

Vue Backtotop Component A Back-to-top component for Vue.js, which scroll page to the top when clicked Demo See demo. Install via npm npm install vue-b

Caio Fernandes 183 Nov 17, 2022