jQuery Plugin For Resizing Elements To Fit Browser Viewport - fitScreen

File Size: 17.3 KB
Views Total: 1063
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin For Resizing Elements To Fit Browser Viewport - fitScreen

fitScreen.js is a jQuery plugin that resizes elements to fit the width and height of the browser view-port, which smoothly pulls the element up or down to show the whole content of the element when the user has stopped scrolling. Useful in one page scrolling website / web application.

How to use it:

1. To use this plugin, you need to load the jQuery fitScreen.js script after you've loaded jQuery.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="fitScreen.js"></script

2. Add a class to the element to use with this plugin and add a class to control it's styling as this:

<div class="fitscreen red"></div>
<div class="fitscreen blue"></div>
<div class="fitscreen yellow"></div>
<div class="fitscreen green"></div>

3. Call the function to active the plugin.

$('.fitscreen').fitScreen();

This awesome jQuery plugin is developed by davidnorminton. For more Advanced Usages, please check the demo page or visit the official website.