Floativ NPM | npm.io

floativ

floativ is a responsive floating scroll-box at the bottom of the screen of your site that contains text, among other things, which can be displayed while browsing a web page. This floating scroll-box disappears when the user reaches an element with a specific id.

See a working demo here.

Installation

Download and install NodeJS
Clone or Download project straight from GitHub.
Extract the zip file and start working.

Directions

cd into the directory and run npm install in order to install all the project dependencies.
Open index.html to see and start working with this project.

NPM Package

You can find and install floativ from npm here.

Usage

Put this $("#floativ").floativ(); inside script tags at the bottom of your HTML file. You can also specify parameters, such as:

<div class="floativ" id="floativ">
    <div class="floativ-container">
        <div class="floativ-head">
            <span>
                <i class="fa fa-plus-circle floativ-expand" aria-hidden="true" aria-label="Expand"></i>
            </span>
            <span>
                <i class="fa fa-minus-circle floativ-collapse" aria-hidden="true" aria-label="Collapse"></i>
            </span>
        </div>
        <div class="floativ-wrapper">
            <div class="floativ-body">
                ... YOUR CONTENT HERE ...
            </div>
        </div>
    </div>
</div>