Collection
Post cover

Best 17 jQuery Fullscreen Menus

Collection of free jQuery fullscreen menu examples and plugins from codepen and other resources.

Fullscreen Menu

Author: Timo Kern

Links: demo and code

Made with: HTML / CSS (Sass) / JS

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Fullscreen Menu

Author: Nvagelis

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

Full screen menu with jQuery and TweenMax animations.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js, tweenmax.js

Fullscreen Menu

Author: Camden Foucht

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

Fullscreen flex menu in jQuery.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Animated Fullscreen Menu

Author: Evan Winston

Links: demo and code

Made with: HTML / CSS / JS

Responsive animated fullscreen menu in jQuery.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, animate.css, jquery.js, bootstrap.js, tweenmax.js

Fullscreen Menu

Author: veronika

Links: demo and code

Made with: HTML / CSS / JS

Fullscreen menu with CSS Flexbox & jQuery.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Full-Screen Menu Toggle

Author: Bridget Reed

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

Full-screen menu toggle with typed.js animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: bootstrap.css, font-awesome.css, animate.css, jquery.js, typed.js, tweenmax.js

Sliding Full Screen Menu Panels

Author: Ryan Gregory

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

Sliding full screen menu panels transition.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: tweenmax.js

Overlay Navigation Animation

Author: Ryan Mulligan

Links: demo and code

Made with: HTML (Pug) / CSS (SCSS) / JS

Experimenting with a full screen menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Fullscreen Menu Type #1

Author: Paul van Oijen

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: animate.css, wow.js

Post cover

Accessible Fullscreen Overlay Menu

Author: RaziTazi

Links: demo and code

Made with: HTML; CSS; JavaScript (jquery.js)

A fairly accessible fullscreen overlay menu built with jQuery and CSS.

Post cover

Quick And Easy Fullscreen Menu

Author: Luigi Mannoni

Links: demo and code

Made with: HTML; CSS/SCSS; JavaScript (jquery.js)

Crafted and debugged in 5 minutes, IE10+ compatible. Might not be ideal for production but would help you if you need a quick working responsive and modern menu.

Post cover

Full Page Off-Canvas Navigation

Author: Caleb Varoga

Links: demo and code

Made with: HTML; CSS; JavaScript (jquery.js)

An example of how to build a full page navigation that exists off of the screen canvas, sliding into view when clicking the menu option. Added spice with a changing background color depending on navigation item hover.

Post cover

Fullscreen Menu

Author: Gerhard Bliedung

Links: demo and code

Made with: HTML; CSS/SCSS; JavaScript (jquery.js)

Fullscreen hamburger menu.

Footer In Menu

Author: Taylor Palmer

Links: demo and code

Made with: HTML (Pug) / CSS (Sass) / JS

An idea to free up real estate by putting the footer links into a full screen menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: font-awesome.css, jquery.js

Animated Menu

Author: Una Kravets

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

Simple animated fullscreen menu in jQuery.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Square-Like Menu

Author: Pete R.

Links: github page

Made with: HTML / CSS / JS

Create a Square-like Menu Animation for Website using jQuery and CSS3.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

jQuery FatNav

Author: Adrien Glitchbone

Links: home page, github page

Made with: HTML / CSS / JS

Fullscreen menu with nice hamburger toggle.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Did you like the post? Share it with your friends!

Follow us on social networks

Feedback