$(document).ready(function() { // card js start $(".mobile-options").on('click', function() { $(".navbar-container .nav-right").slideToggle('slow'); }); $(".search-btn").on('click', function() { $(".main-search").addClass('open'); $('.main-search .form-control').animate({ 'width': '200px', }); }); $(".search-close").on('click', function() { $('.main-search .form-control').animate({ 'width': '0', }); setTimeout(function() { $(".main-search").removeClass('open'); }, 300); }); }); // toggle full screen function toggleFullScreen() { var a = $(window).height() - 10; if (!document.fullscreenElement && // alternative standard method !document.mozFullScreenElement && !document.webkitFullscreenElement) { // current working methods if (document.documentElement.requestFullscreen) { document.documentElement.requestFullscreen(); } else if (document.documentElement.mozRequestFullScreen) { document.documentElement.mozRequestFullScreen(); } else if (document.documentElement.webkitRequestFullscreen) { document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT); } } else { if (document.cancelFullScreen) { document.cancelFullScreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } } $('.full-screen').toggleClass('icon-maximize'); $('.full-screen').toggleClass('icon-minimize'); }
Script Copy url Copy url with Tag
Bootstrap CSS https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css copy copy script
Bootstrap JS https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js copy copy script
Jquery https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js copy copy script

Related Snippets

view all snippets
Latest snippets
About this snippet

Bootstrap 4 Responsive navigation bar snippet is created by BBBootstrap Team using Bootstrap 4.1.1, Javascript 3.2.1. This snippet is free and open source hence you can use it in your project.Bootstrap 4 Responsive navigation bar snippet example is best for Bootstrap navbar, responsive.A great starter for your new awesome project with 1000+ Font Awesome Icons, 4000+ Material Design Icons and Material Design Colors at BBBootstrap.com.

Join BBBootstrap community

Contribute an awesome snippet to help other developer and designers