@madter/fullpagescroll

0.9.2 • Public • Published

Full Page Scroll

Lightweight, cross-browser jQuery full page scroll.

GitHub version

Installation

The plugin requires jQuery 1.8 or higher.

Via npm:

npm install @madter/fullpagescroll

Downloading Manually

If you want the latest stable version, get the latest release from the releases page.

0.9.2

Version 0.9.2 has been release. Still under development. If you have problem then go ahead and report the issue.

What is new

0.9.2

Support arrows for navigation.
Fix scrolling on touchpads.

0.9.1

Extended options. You dont need to have so strict html. Navigation.

Usage

<div id="fullPageScroll">
    <section class="fp-block" data-fphash="first"> // have scrollClass
        // content
    </section>
    <section class="fp-block">
        <div class="fp-noscroll" data-fphash="second"> // have noScrollClass
            // content with own scroll
        </div>
        // more content
    </section>
</div>
$('#fullPageScroll').fullPage([settings]);

element

This should be element that contains sections that you want to scroll.

scrollClass (.fp-block)

Each element that should be scrolled must have this class.

noScrollClass (.fp-noscroll)

Element that should have its own scroll (overflow).

data-fphash

Each element with scrollClass must have data attribute that determine hash in url.

settings

These are the supported settings:

  • scrollClass: Class of section that you want to scroll. Default is .fp-block
  • noScrollClass: Class of a element that can scroll itself (overflow). Default is .fp-noscroll
  • breakpoint: On what size of window (width) you want deactivate full page scroll. Default is 991
  • nav: If you want display bullets navigation. Default is true
  • scrollOffset: Offset of scroll. Default is 0
  • scrollEasing: Easing of animation. Default is swing
  • scrollDuration: Scroll duration. Default is 500
  • resizeCheck: If you want to have check for resize window to determine if you reach breakpoint. Default is true
  • changeUrl: If you hwish change url (you must have data atribut on scrollClass element). Default is true
  • changeDataName: Data name for hash on scrollClass element. Default is fphash
  • scrollOnLoad: If you whish to scroll on load. Default is true

Changing the default settings

As with most plugins, the default settings are exposed so they can be changed.

$.extend($.fullPage.defaults, {
  scrollClass: '.fp-block',
  noScrollClass: '.fp-noscroll'
});

License

(The MIT License)

Copyright (c) 2019 Tomáš Surovčík

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Package Sidebar

Install

npm i @madter/fullpagescroll

Weekly Downloads

7

Version

0.9.2

License

MIT

Unpacked Size

31.6 kB

Total Files

11

Last publish

Collaborators

  • madter