Best jQuery Fullscreen Plugins & Tutorials with Demo

    jQuery fatNav : Fullscreen Menu

    jQuery fatNav : Fullscreen Menu

    Chubby fullscreen menu with nice hamburger toggle.

    Intense Images : JavaScript Full Screen Image Viewer

    Intense Images : JavaScript Full Screen Image Viewer

    A stand alone javascript library for viewing images on the full, full screen. Using the touch/mouse position for panning.

    Intense images is a stand alone library (no jquery, or the likes) so usage is pretty straight forward. All styling of image elements is up to the user, Intense.js only handles the creation, styling and management of the image viewer and captions.

    Zoom Slider with CSS3 & JavaScript

    Zoom Slider with CSS3 & JavaScript

    A simple content slider with depth-like zoom functionality for a predefined area in each slide.Each slide has a predefined zoom area that will be used to calculate the appropriate scale value for a fullscreen fill. Once the icon for zooming is clicked, the zoom area as well as the page get scaled, creating the illusion that the viewer is approaching the item. Once the whole page is covered, we show some more details.

    Transitioning Buttons with CSS3 & JavaScript

    Transitioning Buttons with CSS3 & JavaScript

    Transitioning Buttons is a collection of flat buttons that morph into components. The examples show different types of components, i.e. fullscreen overlay, modal window and many more. The buttons are easy to integrate, customize and are fully responsive. The collection comes with six color themes including a quick setup guide.

    jQuery Menu Puncher

    jQuery Menu Puncher

    Menupuncher is simple fullscreen navigation plugin for jquery.

    AnimatedModal.js : jQuery fullscreen modal with CSS3

    AnimatedModal.js : jQuery fullscreen modal with CSS3

    AnimatedModal.js is a jQuery plugin to create a fullscreen modal with CSS3 transitions. you can use the transitions by animate.css or create yourself their transitions.

    jQuery Bootstrap Fullscreen Select

    jQuery Bootstrap Fullscreen Select

    Bootstrap select for mobile devices, originally made for select controls in Cordova/PhoneGap mobile applications.A custom fullscreen select / multiselect for Bootstrap using BUTTONS or User defined elements, designed for mobile devices.

    OpenFooter : jQuery Responsive Full Screen Footer

    OpenFooter : jQuery Responsive Full Screen Footer

    OpenFooter jQuery is a small script that is used to create the unique responsive footer with power features. With this plugin you can make a footer with many kinds of content (Text, images/photos, videos/iframes…) and you can add content as much as you want. Additionally, this plugin also allow you expand the footer to fullscreen for easier view.

    okvideo : jQuery Fullscreen background Videos Plugin

    okvideo : jQuery Fullscreen background Videos Plugin

    OKVideo is a jQuery plugin that allows for YouTube or Vimeo videos to be used as full-screen backgrounds on webpages. OKVideo aims to be customizable while making some basic decisions about how the plugin should control video. When using OKVideo, all videos will be served from Vimeo or YouTube based on a number of variables like browser, device, bandwidth, etc.

    CSS3 Sliding Header Layout

    CSS3 Sliding Header Layout

    Today we’d like to show you how to create a simple grid layout with a special header effect. The idea is to initially show a fullscreen image with a title and a toggle button that allows to change the view to a grid. The header with the fullscreen image animates upwards and reveals a grid of image anchors with a title. We’ll be using some techniques like Flexbox and CSS Transitions for modern browsers.