FullView.Js

Javascript | JQuery Plugin

Create full screen pages fast and simple - A simple and easy to use library that creates fullscreen scrolling websites.

Compatibility

Demo online | Codepen

Get Started

Dependency: jQuery 1.1+ All you will need to include:

• The JavaScript file fullview.js (or its minified version fullview.min.js)
• The css file fullview.css (or its minified version fullview.min.css)

Including files:

<link rel="stylesheet" type="text/css" href="fullview.css" />

<!-- Javascript Files -->
<script  src="https://code.jquery.com/jquery-3.5.1.min.js"  crossorigin="anonymous"></script>

<script type="text/javascript" src="fullview.js"></script>

Using CDNS

Optionally, If you prefer to use a CDN to load the needed files,

https://unpkg.com/fullview/dist/fullview.min.css

https://unpkg.com/fullview/dist/fullview.min.js

Using NPM

Optionally, you can install fullView.js with npm

npm install fullview

Usage

HTML Structure

<div id="fullview">
        <div>
            <!-- Your Code -->
        </div>
        <div>
           <!-- Your Code -->
        </div>
        <div>
            <!-- Your Code -->
        </div>
        <div>
            <!-- Your Code -->
        </div>
    </div>

Initialization

$("#fullview").fullView({
    //Navigation
    dots:  true,
    dotsPosition:  'right',

    //Scrolling
    easing:  'swing',

    // Callback
    onViewChange:  function (currentView) {
     console.log(currentView)
    }
})

Options

License

If you are creating an open source application under a license compatible with the GNU GPL license v3, you may use it under the terms of the GPLv3.