-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathjs-css-menu.min.css
More file actions
9 lines (9 loc) · 5.97 KB
/
js-css-menu.min.css
File metadata and controls
9 lines (9 loc) · 5.97 KB
1
2
3
4
5
6
7
8
9
/*
* Responsive CSS3 Menu with Dropdown (Horizontal and Vertical)
* http://www.jonsuh.com
*
* Copyright (c) 2012 Jonathan Suh
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/
.js-css-menu{font-family:Helvetica,Arial,sans-serif;font-size:13px;border:1px solid #900000;display:inline-block}.js-css-menu,.js-css-menu ul,.js-css-menu li{list-style:none;padding:0;margin:0}.js-css-menu a{text-decoration:none;-moz-transition:all .15s ease-in-out;-webkit-transition:all .15s ease-in-out;-o-transition:all .15s ease-in-out;-ms-transition:all .15s ease-in-out;transition:all .15s ease-in-out}.js-css-menu>li{display:inline-block;float:left}.js-css-menu>li>a{color:#fefefe;text-shadow:0 -1px 0 maroon;background-color:#d00;background-image:linear-gradient(top,#d00 20%,#a00);background-image:-moz-linear-gradient(top,#d00 20%,#a00);background-image:-webkit-linear-gradient(top,#d00 20%,#a00);background-image:-o-linear-gradient(top,#d00 20%,#a00);background-image:-ms-linear-gradient(top,#d00 20%,#a00);background-image:-webkit-gradient(linear,left top,left bottom,from(#d00) 20%,to(#a00));filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='$to',EndColorStr='$from');padding:10px 15px;display:block}.js-css-menu>li:hover>a{background-color:#fa0000;background-image:linear-gradient(top,#fa0000 20%,#af0000);background-image:-moz-linear-gradient(top,#fa0000 20%,#af0000);background-image:-webkit-linear-gradient(top,#fa0000 20%,#af0000);background-image:-o-linear-gradient(top,#fa0000 20%,#af0000);background-image:-ms-linear-gradient(top,#fa0000 20%,#af0000);background-image:-webkit-gradient(linear,left top,left bottom,from(#fa0000) 20%,to(#af0000));filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='$to',EndColorStr='$from')}.js-css-menu>li>a:active{background-color:#a00;background-image:linear-gradient(top,#a00 20%,#c00);background-image:-moz-linear-gradient(top,#a00 20%,#c00);background-image:-webkit-linear-gradient(top,#a00 20%,#c00);background-image:-o-linear-gradient(top,#a00 20%,#c00);background-image:-ms-linear-gradient(top,#a00 20%,#c00);background-image:-webkit-gradient(linear,left top,left bottom,from(#a00) 20%,to(#c00));filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='$to',EndColorStr='$from');box-shadow:inset 0 1px 7px rgba(0,0,0,0.25);-moz-box-shadow:inset 0 1px 7px rgba(0,0,0,0.25);-webkit-box-shadow:inset 0 1px 7px rgba(0,0,0,0.25)}.js-css-menu>li.current>a{background-color:#800;background-image:linear-gradient(top,#800 20%,#a00);background-image:-moz-linear-gradient(top,#800 20%,#a00);background-image:-webkit-linear-gradient(top,#800 20%,#a00);background-image:-o-linear-gradient(top,#800 20%,#a00);background-image:-ms-linear-gradient(top,#800 20%,#a00);background-image:-webkit-gradient(linear,left top,left bottom,from(#800) 20%,to(#a00));filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='$to',EndColorStr='$from');box-shadow:inset 0 1px 7px rgba(0,0,0,0.25);-moz-box-shadow:inset 0 1px 7px rgba(0,0,0,0.25);-webkit-box-shadow:inset 0 1px 7px rgba(0,0,0,0.25)}.js-css-menu>li div{border-top:1px solid #900000;display:block;position:absolute;visibility:hidden;opacity:0;-moz-transition:all .15s ease-in-out;-webkit-transition:all .15s ease-in-out;-o-transition:all .15s ease-in-out;-ms-transition:all .15s ease-in-out;transition:all .15s ease-in-out}.js-css-menu>li div a{color:#ddd}.js-css-menu>li div a:hover,.js-css-menu>li div a:focus{color:#fefefe}.js-css-menu>li div ul{float:left}.js-css-menu>li div ul li{line-height:1.5em}.js-css-menu>li div ul:not(:first-child){margin-left:20px}.js-css-menu>li:hover div,.js-css-menu>li:focus div{color:#fefefe;background:#b00000;padding:10px 15px;visibility:visible;opacity:1}.js-css-menu.vertical{width:100px}.js-css-menu.vertical>li{display:block;float:none;position:relative}.js-css-menu.vertical>li div{width:150px;left:101px;top:0}.js-css-menu.rounded{border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px}.js-css-menu.rounded>li:first-child>a{border-top-left-radius:2px;-moz-border-radius-topleft:2px;-webkit-border-top-left-radius:2px;border-bottom-left-radius:2px;-moz-border-radius-bottomleft:2px;-webkit-border-bottom-left-radius:2px}.js-css-menu.rounded>li:last-child>a{border-top-right-radius:2px;-moz-border-radius-topright:2px;-webkit-border-top-right-radius:2px;border-bottom-right-radius:2px;-moz-border-radius-bottomright:2px;-webkit-border-bottom-right-radius:2px}.js-css-menu.rounded>li div{border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;border-top-left-radius:0;-moz-border-radius-topleft:0;-webkit-border-top-left-radius:0}.js-css-menu.rounded.vertical>li:first-child>a{border-bottom-left-radius:0;-moz-border-radius-bottomleft:0;-webkit-border-bottom-left-radius:0;border-top-right-radius:2px;-moz-border-radius-topright:2px;-webkit-border-top-right-radius:2px}.js-css-menu.rounded.vertical>li:last-child>a{border-top-right-radius:0;-moz-border-radius-topright:0;-webkit-border-top-right-radius:0;border-bottom-left-radius:2px;-moz-border-radius-bottomleft:2px;-webkit-border-bottom-left-radius:2px}.js-css-menu.shadow,.js-css-menu.shadow div{box-shadow:0 1px 2px rgba(0,0,0,0.2);-moz-box-shadow:0 1px 2px rgba(0,0,0,0.2);-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.2)}@media(max-width:480px){.js-css-menu.responsive,.js-css-menu.responsive>li{width:auto!important;display:block;float:none}.js-css-menu.responsive>li:first-child>a{border-bottom-left-radius:0!important;-moz-border-radius-bottomleft:0!important;-webkit-border-bottom-left-radius:0!important;border-bottom-right-radius:0!important;-moz-border-radius-bottomright:0!important;-webkit-border-bottom-right-radius:0!important}.js-css-menu.responsive>li:last-child>a{border-top-left-radius:0!important;-moz-border-radius-topleft:0!important;-webkit-border-top-left-radius:0!important;border-top-right-radius:0!important;-moz-border-radius-topright:0!important;-webkit-border-top-right-radius:0!important}.js-css-menu.responsive>li div{display:none!important}}