Horizontal Drop Down Menu

Developer
Kazu
Size
7,820 Kb
Views
12,144
  1. Horizontal Drop Down Menu Previews
  2. Horizontal Drop Down Menu HTML Codes
  3. Horizontal Drop Down Menu CSS Codes
  4. Horizontal Drop Down Menu JS Codes

How do I make an horizontal drop down menu?

Http://tympanus.net/codrops/2013/03/05/horizontal-drop-down-menu/. What is a horizontal drop down menu? How do you make a horizontal drop down menu? This script and codes were developed by Kazu on 16 October 2022, Sunday.

Horizontal Drop Down Menu Previews
IQ Test

Horizontal Drop Down Menu - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Horizontal Drop Down Menu</title> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<html lang="en" class="no-js">	<head>	<meta charset="UTF-8" />	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">	<meta name="viewport" content="width=device-width, initial-scale=1.0">	<title>Blueprint: Horizontal Drop-Down Menu</title>	<meta name="description" content="Blueprint: Horizontal Drop-Down Menu" />	<meta name="keywords" content="horizontal menu, microsoft menu, drop-down menu, mega menu, javascript, jquery, simple menu" />	<meta name="author" content="Codrops" />	<link rel="shortcut icon" href="../favicon.ico">	<link rel="stylesheet" type="text/css" href="css/default.css" />	<link rel="stylesheet" type="text/css" href="css/component.css" />	<script src="js/modernizr.custom.js"></script>	</head>	<body>	<div class="container">	<header class="clearfix">	<span>Blueprint</span>	<h1>Horizontal Drop-Down Menu</h1>	<nav>	<a href="https://tympanus.net/Blueprints/FullWidthImageSlider/" class="icon-arrow-left" data-info="previous Blueprint">Previous Blueprint</a>	<a href="https://tympanus.net/codrops/?p=14426" class="icon-drop" data-info="back to the Codrops article">back to the Codrops article</a>	</nav>	</header>	<div class="main">	<nav id="cbp-hrmenu" class="cbp-hrmenu">	<ul>	<li>	<a href="#">Products</a>	<div class="cbp-hrsub">	<div class="cbp-hrsub-inner">	<div>	<h4>Learning &amp; Games</h4>	<ul>	<li><a href="#">Catch the Bullet</a></li>	<li><a href="#">Snoopydoo</a></li>	<li><a href="#">Fallen Angel</a></li>	<li><a href="#">Sui Maker</a></li>	<li><a href="#">Wave Master</a></li>	<li><a href="#">Golf Pro</a></li>	</ul>	</div>	<div>	<h4>Utilities</h4>	<ul>	<li><a href="#">Gadget Finder</a></li>	<li><a href="#">Green Tree Express</a></li>	<li><a href="#">Green Tree Pro</a></li>	<li><a href="#">Wobbler 3.0</a></li>	<li><a href="#">Coolkid</a></li>	</ul>	</div>	<div>	<h4>Education</h4>	<ul>	<li><a href="#">Learn Thai</a></li>	<li><a href="#">Math Genius</a></li>	<li><a href="#">Chemokid</a></li>	</ul>	<h4>Professionals</h4>	<ul>	<li><a href="#">Success 1.0</a></li>	<li><a href="#">Moneymaker</a></li>	</ul>	</div>	</div><!-- /cbp-hrsub-inner -->	</div><!-- /cbp-hrsub -->	</li>	<li>	<a href="#">Downloads</a>	<div class="cbp-hrsub">	<div class="cbp-hrsub-inner">	<div>	<h4>Education &amp; Learning</h4>	<ul>	<li><a href="#">Learn Thai</a></li>	<li><a href="#">Math Genius</a></li>	<li><a href="#">Chemokid</a></li>	</ul>	<h4>Professionals</h4>	<ul>	<li><a href="#">Success 1.0</a></li>	<li><a href="#">Moneymaker</a></li>	</ul>	</div>	<div>	<h4>Entertainment</h4>	<ul>	<li><a href="#">Gadget Finder</a></li>	<li><a href="#">Green Tree Express</a></li>	<li><a href="#">Green Tree Pro</a></li>	<li><a href="#">Holy Cannoli</a></li>	<li><a href="#">Wobbler 3.0</a></li>	<li><a href="#">Coolkid</a></li>	</ul>	</div>	<div>	<h4>Games</h4>	<ul>	<li><a href="#">Catch the Bullet</a></li>	<li><a href="#">Snoopydoo</a></li>	<li><a href="#">Fallen Angel</a></li>	<li><a href="#">Sui Maker</a></li>	<li><a href="#">Wave Master</a></li>	<li><a href="#">Golf Pro</a></li>	</ul>	</div>	</div><!-- /cbp-hrsub-inner -->	</div><!-- /cbp-hrsub -->	</li>	<li>	<a href="#">Applications</a>	<div class="cbp-hrsub">	<div class="cbp-hrsub-inner">	<div>	<h4>Learning &amp; Games</h4>	<ul>	<li><a href="#">Catch the Bullet</a></li>	<li><a href="#">Snoopydoo</a></li>	</ul>	<h4>Utilities</h4>	<ul>	<li><a href="#">Gadget Finder</a></li>	<li><a href="#">Green Tree Express</a></li>	<li><a href="#">Green Tree Pro</a></li>	<li><a href="#">Wobbler 3.0</a></li>	<li><a href="#">Coolkid</a></li>	</ul>	</div>	<div>	<h4>Education</h4>	<ul>	<li><a href="#">Learn Thai</a></li>	<li><a href="#">Math Genius</a></li>	<li><a href="#">Chemokid</a></li>	</ul>	<h4>Professionals</h4>	<ul>	<li><a href="#">Success 1.0</a></li>	<li><a href="#">Moneymaker</a></li>	</ul>	</div>	</div><!-- /cbp-hrsub-inner -->	</div><!-- /cbp-hrsub -->	</li>	<li>	<a href="#">Projects</a>	<div class="cbp-hrsub">	<div class="cbp-hrsub-inner">	<div>	<h4>Learning &amp; Games</h4>	<ul>	<li><a href="#">Catch the Bullet</a></li>	<li><a href="#">Snoopydoo</a></li>	<li><a href="#">Fallen Angel</a></li>	<li><a href="#">Sui Maker</a></li>	<li><a href="#">Wave Master</a></li>	<li><a href="#">Golf Pro</a></li>	</ul>	<h4>Utilities</h4>	<ul>	<li><a href="#">Gadget Finder</a></li>	<li><a href="#">Green Tree Express</a></li>	</ul>	</div>	<div>	<h4>Entertainment</h4>	<ul>	<li><a href="#">Gadget Finder</a></li>	<li><a href="#">Green Tree Express</a></li>	<li><a href="#">Green Tree Pro</a></li>	<li><a href="#">Holy Cannoli</a></li>	<li><a href="#">Wobbler 3.0</a></li>	<li><a href="#">Coolkid</a></li>	</ul>	</div>	</div><!-- /cbp-hrsub-inner -->	</div><!-- /cbp-hrsub -->	</li>	<li>	<a href="#">Freeware</a>	<div class="cbp-hrsub">	<div class="cbp-hrsub-inner">	<div>	<h4>Utilities</h4>	<ul>	<li><a href="#">Green Tree Pro</a></li>	<li><a href="#">Wobbler 3.0</a></li>	<li><a href="#">Coolkid</a></li>	</ul>	<h4>Education</h4>	<ul>	<li><a href="#">Learn Thai</a></li>	<li><a href="#">Math Genius</a></li>	<li><a href="#">Chemokid</a></li>	</ul>	</div>	<div>	<h4>Professionals</h4>	<ul>	<li><a href="#">Success 1.0</a></li>	<li><a href="#">Moneymaker</a></li>	</ul>	</div>	<div>	<h4>Learning &amp; Games</h4>	<ul>	<li><a href="#">Catch the Bullet</a></li>	<li><a href="#">Snoopydoo</a></li>	<li><a href="#">Fallen Angel</a></li>	<li><a href="#">Sui Maker</a></li>	<li><a href="#">Wave Master</a></li>	<li><a href="#">Golf Pro</a></li>	</ul>	</div>	</div><!-- /cbp-hrsub-inner -->	</div><!-- /cbp-hrsub -->	</li>	</ul>	</nav>	</div>	</div>	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>	<script src="js/cbpHorizontalMenu.min.js"></script>	<script>	$(function() {	cbpHorizontalMenu.init();	});	</script>	</body>
</html> <script src="js/index.js"></script>
</body>
</html>

Horizontal Drop Down Menu - Script Codes CSS Codes

.cbp-hrmenu {	width: 100%;	margin-top: 2em;	border-bottom: 4px solid #47a3da;
}
/* general ul style */
.cbp-hrmenu ul {	margin: 0;	padding: 0;	list-style-type: none;
}
/* first level ul style */
.cbp-hrmenu > ul,
.cbp-hrmenu .cbp-hrsub-inner {	width: 90%;	max-width: 70em;	margin: 0 auto;	padding: 0 1.875em;
}
.cbp-hrmenu > ul > li {	display: inline-block;
}
.cbp-hrmenu > ul > li > a {	font-weight: 700;	padding: 1em 2em;	color: #999;	display: inline-block;
}
.cbp-hrmenu > ul > li > a:hover {	color: #47a3da;
}
.cbp-hrmenu > ul > li.cbp-hropen a,
.cbp-hrmenu > ul > li.cbp-hropen > a:hover {	color: #fff;	background: #47a3da;
}
/* sub-menu */
.cbp-hrmenu .cbp-hrsub {	display: none;	position: absolute;	background: #47a3da;	width: 100%;	left: 0;
}
.cbp-hropen .cbp-hrsub {	display: block;	padding-bottom: 3em;
}
.cbp-hrmenu .cbp-hrsub-inner > div {	width: 33%;	float: left;	padding: 0 2em 0;
}
.cbp-hrmenu .cbp-hrsub-inner:before,
.cbp-hrmenu .cbp-hrsub-inner:after {	content: " ";	display: table;
}
.cbp-hrmenu .cbp-hrsub-inner:after {	clear: both;
}
.cbp-hrmenu .cbp-hrsub-inner > div a {	line-height: 2em;
}
.cbp-hrsub h4 {	color: #afdefa;	padding: 2em 0 0.6em;	margin: 0;	font-size: 160%;	font-weight: 300;
}
/* Examples for media queries */
@media screen and (max-width: 52.75em) {	.cbp-hrmenu {	font-size: 80%;	}
}
@media screen and (max-width: 43em) {	.cbp-hrmenu {	font-size: 120%;	border: none;	}	.cbp-hrmenu > ul,	.cbp-hrmenu .cbp-hrsub-inner {	width: 100%;	padding: 0;	}	.cbp-hrmenu .cbp-hrsub-inner {	padding: 0 2em;	font-size: 75%;	}	.cbp-hrmenu > ul > li {	display: block;	border-bottom: 4px solid #47a3da;	}	.cbp-hrmenu > ul > li > a {	display: block;	padding: 1em 3em;	}	.cbp-hrmenu .cbp-hrsub {	position: relative;	}	.cbp-hrsub h4 {	padding-top: 0.6em;	}
}
@media screen and (max-width: 36em) {	.cbp-hrmenu .cbp-hrsub-inner > div {	width: 100%;	float: none;	padding: 0 2em;	}
}
/* General Demo Style */
@import url(https://fonts.googleapis.com/css?family=Lato:300,400,700);
@font-face {	font-family: 'fontawesome';	src:url('../fonts/fontawesome.eot');	src:url('../fonts/fontawesome.eot?#iefix') format('embedded-opentype'),	url('../fonts/fontawesome.svg#fontawesome') format('svg'),	url('../fonts/fontawesome.woff') format('woff'),	url('../fonts/fontawesome.ttf') format('truetype');	font-weight: normal;	font-style: normal;
}
body, html { font-size: 100%;	padding: 0; margin: 0;}
/* Reset */
*,
*:after,
*:before {	-webkit-box-sizing: border-box;	-moz-box-sizing: border-box;	box-sizing: border-box;
}
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {	content: " ";	display: table;
}
.clearfix:after {	clear: both;
}
body { font-family: 'Lato', Calibri, Arial, sans-serif; color: #47a3da;
}
a {	color: #f0f0f0;	text-decoration: none;
}
a:hover {	color: #000;
}
.container > header {	width: 90%;	max-width: 70em;	margin: 0 auto;	padding: 0 1.875em 3.125em 1.875em;
}
.container > header {	padding: 2.875em 1.875em 1.875em;
}
.container > header h1 {	font-size: 2.125em;	line-height: 1.3;	margin: 0;	float: left;	font-weight: 400;
}
.container > header span {	display: block;	font-weight: 700;	text-transform: uppercase;	letter-spacing: 0.5em;	padding: 0 0 0.6em 0.1em;
}
.container > header nav {	float: right;
}
.container > header nav a {	display: block;	float: left;	position: relative;	width: 2.5em;	height: 2.5em;	background: #fff;	border-radius: 50%;	color: transparent;	margin: 0 0.1em;	border: 4px solid #47a3da;	text-indent: -8000px;
}
.container > header nav a:after {	content: attr(data-info);	color: #47a3da;	position: absolute;	width: 600%;	top: 120%;	text-align: right;	right: 0;	opacity: 0;	pointer-events: none;
}
.container > header nav a:hover:after {	opacity: 1;
}
.container > header nav a:hover {	background: #47a3da;
}
.icon-drop:before,
.icon-arrow-left:before {	font-family: 'fontawesome';	position: absolute;	top: 0;	width: 100%;	height: 100%;	speak: none;	font-style: normal;	font-weight: normal;	line-height: 2;	text-align: center;	color: #47a3da;	-webkit-font-smoothing: antialiased;	text-indent: 8000px;	padding-left: 8px;
}
.container > header nav a:hover:before {	color: #fff;
}
.icon-drop:before {	content: "\e000";
}
.icon-arrow-left:before {	content: "\f060";
}

Horizontal Drop Down Menu - Script Codes JS Codes

/** * cbpHorizontalMenu.js v1.0.0 * http://www.codrops.com * * Licensed under the MIT license. * https://www.opensource.org/licenses/mit-license.php * * Copyright 2013, Codrops * http://www.codrops.com */
var cbpHorizontalMenu = (function() {	var $listItems = $( '#cbp-hrmenu > ul > li' ),	$menuItems = $listItems.children( 'a' ),	$body = $( 'body' ),	current = -1;	function init() {	$menuItems.on( 'click', open );	$listItems.on( 'click', function( event ) { event.stopPropagation(); } );	}	function open( event ) {	if( current !== -1 ) {	$listItems.eq( current ).removeClass( 'cbp-hropen' );	}	var $item = $( event.currentTarget ).parent( 'li' ),	idx = $item.index();	if( current === idx ) {	$item.removeClass( 'cbp-hropen' );	current = -1;	}	else {	$item.addClass( 'cbp-hropen' );	current = idx;	$body.off( 'click' ).on( 'click', close );	}	return false;	}	function close( event ) {	$listItems.eq( current ).removeClass( 'cbp-hropen' );	current = -1;	}	return { init : init };
})();
var cbpHorizontalMenu=(function(){var b=$("#cbp-hrmenu > ul > li"),g=b.children("a"),c=$("body"),d=-1;function f(){g.on("click",a);b.on("click",function(h){h.stopPropagation()})}function a(j){if(d!==-1){b.eq(d).removeClass("cbp-hropen")}var i=$(j.currentTarget).parent("li"),h=i.index();if(d===h){i.removeClass("cbp-hropen");d=-1}else{i.addClass("cbp-hropen");d=h;c.off("click").on("click",e)}return false}function e(h){b.eq(d).removeClass("cbp-hropen");d=-1}return{init:f}})();
/* Modernizr 2.6.2 (Custom Build) | MIT & BSD * Build: https://modernizr.com/download/#-shiv-cssclasses-load */
;window.Modernizr=function(a,b,c){function u(a){j.cssText=a}function v(a,b){return u(prefixes.join(a+";")+(b||""))}function w(a,b){return typeof a===b}function x(a,b){return!!~(""+a).indexOf(b)}function y(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:w(f,"function")?f.bind(d||b):f}return!1}var d="2.6.2",e={},f=!0,g=b.documentElement,h="modernizr",i=b.createElement(h),j=i.style,k,l={}.toString,m={},n={},o={},p=[],q=p.slice,r,s={}.hasOwnProperty,t;!w(s,"undefined")&&!w(s.call,"undefined")?t=function(a,b){return s.call(a,b)}:t=function(a,b){return b in a&&w(a.constructor.prototype[b],"undefined")},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!="function")throw new TypeError;var d=q.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(q.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(q.call(arguments)))};return e});for(var z in m)t(m,z)&&(r=z.toLowerCase(),e[r]=m[z](),p.push((e[r]?"":"no-")+r));return e.addTest=function(a,b){if(typeof a=="object")for(var d in a)t(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,typeof f!="undefined"&&f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},u(""),i=k=null,function(a,b){function k(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function l(){var a=r.elements;return typeof a=="string"?a.split(" "):a}function m(a){var b=i[a[g]];return b||(b={},h++,a[g]=h,i[h]=b),b}function n(a,c,f){c||(c=b);if(j)return c.createElement(a);f||(f=m(c));var g;return f.cache[a]?g=f.cache[a].cloneNode():e.test(a)?g=(f.cache[a]=f.createElem(a)).cloneNode():g=f.createElem(a),g.canHaveChildren&&!d.test(a)?f.frag.appendChild(g):g}function o(a,c){a||(a=b);if(j)return a.createDocumentFragment();c=c||m(a);var d=c.frag.cloneNode(),e=0,f=l(),g=f.length;for(;e<g;e++)d.createElement(f[e]);return d}function p(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return r.shivMethods?n(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+l().join().replace(/\w+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(r,b.frag)}function q(a){a||(a=b);var c=m(a);return r.shivCSS&&!f&&!c.hasCSS&&(c.hasCSS=!!k(a,"article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}")),j||p(a,c),a}var c=a.html5||{},d=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,e=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,f,g="_html5shiv",h=0,i={},j;(function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",f="hidden"in a,j=a.childNodes.length==1||function(){b.createElement("a");var a=b.createDocumentFragment();return typeof a.cloneNode=="undefined"||typeof a.createDocumentFragment=="undefined"||typeof a.createElement=="undefined"}()}catch(c){f=!0,j=!0}})();var r={elements:c.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:c.shivCSS!==!1,supportsUnknownElements:j,shivMethods:c.shivMethods!==!1,type:"default",shivDocument:q,createElement:n,createDocumentFragment:o};a.html5=r,q(b)}(this,b),e._version=d,g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+p.join(" "):""),e}(this,this.document),function(a,b,c){function d(a){return"[object Function]"==o.call(a)}function e(a){return"string"==typeof a}function f(){}function g(a){return!a||"loaded"==a||"complete"==a||"uninitialized"==a}function h(){var a=p.shift();q=1,a?a.t?m(function(){("c"==a.t?B.injectCss:B.injectJs)(a.s,0,a.a,a.x,a.e,1)},0):(a(),h()):q=0}function i(a,c,d,e,f,i,j){function k(b){if(!o&&g(l.readyState)&&(u.r=o=1,!q&&h(),l.onload=l.onreadystatechange=null,b)){"img"!=a&&m(function(){t.removeChild(l)},50);for(var d in y[c])y[c].hasOwnProperty(d)&&y[c][d].onload()}}var j=j||B.errorTimeout,l=b.createElement(a),o=0,r=0,u={t:d,s:c,e:f,a:i,x:j};1===y[c]&&(r=1,y[c]=[]),"object"==a?l.data=c:(l.src=c,l.type=a),l.width=l.height="0",l.onerror=l.onload=l.onreadystatechange=function(){k.call(this,r)},p.splice(e,0,u),"img"!=a&&(r||2===y[c]?(t.insertBefore(l,s?null:n),m(k,j)):y[c].push(l))}function j(a,b,c,d,f){return q=0,b=b||"j",e(a)?i("c"==b?v:u,a,b,this.i++,c,d,f):(p.splice(this.i++,0,a),1==p.length&&h()),this}function k(){var a=B;return a.loader={load:j,i:0},a}var l=b.documentElement,m=a.setTimeout,n=b.getElementsByTagName("script")[0],o={}.toString,p=[],q=0,r="MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNode,l=a.opera&&"[object Opera]"==o.call(a.opera),l=!!b.attachEvent&&!l,u=r?"object":l?"script":"img",v=l?"script":u,w=Array.isArray||function(a){return"[object Array]"==o.call(a)},x=[],y={},z={timeout:function(a,b){return b.length&&(a.timeout=b[0]),a}},A,B;B=function(a){function b(a){var a=a.split("!"),b=x.length,c=a.pop(),d=a.length,c={url:c,origUrl:c,prefixes:a},e,f,g;for(f=0;f<d;f++)g=a[f].split("="),(e=z[g.shift()])&&(c=e(c,g));for(f=0;f<b;f++)c=x[f](c);return c}function g(a,e,f,g,h){var i=b(a),j=i.autoCallback;i.url.split(".").pop().split("?").shift(),i.bypass||(e&&(e=d(e)?e:e[a]||e[g]||e[a.split("/").pop().split("?")[0]]),i.instead?i.instead(a,e,f,g,h):(y[i.url]?i.noexec=!0:y[i.url]=1,f.load(i.url,i.forceCSS||!i.forceJS&&"css"==i.url.split(".").pop().split("?").shift()?"c":c,i.noexec,i.attrs,i.timeout),(d(e)||d(j))&&f.load(function(){k(),e&&e(i.origUrl,h,g),j&&j(i.origUrl,h,g),y[i.url]=2})))}function h(a,b){function c(a,c){if(a){if(e(a))c||(j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}),g(a,j,b,0,h);else if(Object(a)===a)for(n in m=function(){var b=0,c;for(c in a)a.hasOwnProperty(c)&&b++;return b}(),a)a.hasOwnProperty(n)&&(!c&&!--m&&(d(j)?j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}:j[n]=function(a){return function(){var b=[].slice.call(arguments);a&&a.apply(this,b),l()}}(k[n])),g(a[n],j,b,n,h))}else!c&&l()}var h=!!a.test,i=a.load||a.both,j=a.callback||f,k=j,l=a.complete||f,m,n;c(h?a.yep:a.nope,!!i),i&&c(i)}var i,j,l=this.yepnope.loader;if(e(a))g(a,0,l,0);else if(w(a))for(i=0;i<a.length;i++)j=a[i],e(j)?g(j,0,l,0):w(j)?B(j):Object(j)===j&&h(j,l);else Object(a)===a&&h(a,l)},B.addPrefix=function(a,b){z[a]=b},B.addFilter=function(a){x.push(a)},B.errorTimeout=1e4,null==b.readyState&&b.addEventListener&&(b.readyState="loading",b.addEventListener("DOMContentLoaded",A=function(){b.removeEventListener("DOMContentLoaded",A,0),b.readyState="complete"},0)),a.yepnope=k(),a.yepnope.executeStack=h,a.yepnope.injectJs=function(a,c,d,e,i,j){var k=b.createElement("script"),l,o,e=e||B.errorTimeout;k.src=a;for(o in d)k.setAttribute(o,d[o]);c=j?h:c||f,k.onreadystatechange=k.onload=function(){!l&&g(k.readyState)&&(l=1,c(),k.onload=k.onreadystatechange=null)},m(function(){l||(l=1,c(1))},e),i?k.onload():n.parentNode.insertBefore(k,n)},a.yepnope.injectCss=function(a,c,d,e,g,i){var e=b.createElement("link"),j,c=i?h:c||f;e.href=a,e.rel="stylesheet",e.type="text/css";for(j in d)e.setAttribute(j,d[j]);g||(n.parentNode.insertBefore(e,n),m(c,0))}}(this,document),Modernizr.load=function(){yepnope.apply(window,[].slice.call(arguments,0))};
Horizontal Drop Down Menu - Script Codes
Horizontal Drop Down Menu - Script Codes
Home Page Home
Developer Kazu
Username carmerano
Uploaded October 16, 2022
Rating 3.5
Size 7,820 Kb
Views 12,144
Do you need developer help for Horizontal Drop Down Menu?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Kazu (carmerano) Script Codes
Name
Navigation Menu Hover Effect
A Pen by Kazu
Flexbox
LESS color spinning function - triadic
3D shading with box shadow
Hover Effect Test
Responsive Table
CSS Continuous Slide
Responsive Menu Button
Rader Chart
Create amazing blog posts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!