User:Vinoo/2014Design6

From 2014.igem.org

(Difference between revisions)
m
m
Line 2: Line 2:
<style type="text/css">
<style type="text/css">
-
.click-nav-container {  
+
#loginBarContainer {  
width: 100%;  
width: 100%;  
position: fixed;  
position: fixed;  
Line 11: Line 11:
z-index: 1000;
z-index: 1000;
}
}
-
.click-nav {
+
#loginBar {
width: 960px;  
width: 960px;  
height: 100%;  
height: 100%;  
margin: 0px auto;  
margin: 0px auto;  
}
}
-
.click-nav ul {position:relative;font-weight:900;}
+
#loginBar ul {position:relative;font-weight:900;}
-
.click-nav ul li {position:relative;list-style:none;cursor:pointer; display: table-cell;}
+
#loginBar ul li {position:relative;list-style:none;cursor:pointer; display: table-cell;}
-
.click-nav ul li ul {position:absolute;left:0;right:0;}
+
#loginBar ul li ul {position:absolute;left:0;right:0;}
-
.click-nav ul .clicker {position:relative;color:#FFF;}
+
#loginBar ul .clicker {position:relative;color:#FFF;}
-
.click-nav ul .clicker:hover,.click-nav ul .active {background:#ccc;}
+
#loginBar ul .clicker:hover,.click-nav ul .active {background:#ccc;}
-
.click-nav ul li a {transition:background-color 0.2s ease-in-out;-webkit-transition:background-color 0.2s ease-in-out;
+
#loginBar ul li a {transition:background-color 0.2s ease-in-out;-webkit-transition:background-color 0.2s ease-in-out;
-moz-transition:background-color 0.2s ease-in-out;display:block;color:#333;text-decoration:none;}
-moz-transition:background-color 0.2s ease-in-out;display:block;color:#333;text-decoration:none;}
-
.click-nav ul li a:hover {background:#ccc;}
+
#loginBar ul li a:hover {background:#ccc;}
/* Fallbacks */
/* Fallbacks */
-
.click-nav .no-js ul {display:none;}
+
#loginBar .no-js ul {display:none;}
-
click.nav > .no-js > li:hover > ul {
+
#loginBar > .no-js > li:hover > ul {
display:block;
display:block;
}
}
Line 33: Line 33:
</style>
</style>
-
<div class="click-nav-container">
+
<div id="loginBarContainer">
-
<div class="click-nav">
+
<div id="loginBar">
     <ul class="no-js">
     <ul class="no-js">
         <li>
         <li>
Line 62: Line 62:
<script>
<script>
$(function () {
$(function () {
-
     $('.click-nav > ul').toggleClass('no-js js');
+
     $('#loginBar > ul').toggleClass('no-js js');
-
     $('.click-nav .js ul').hide();
+
     $('loginBar .js ul').hide();
$(document).on("click", function(e) {
$(document).on("click", function(e) {
var $elem = $(e.target);
var $elem = $(e.target);
if ($elem.hasClass('clicker')) {
if ($elem.hasClass('clicker')) {
-
$('.click-nav .js ul').not($elem.next('ul')).hide();
+
$('#loginBar .js ul').not($elem.next('ul')).hide();
$elem.next("ul").slideToggle();
$elem.next("ul").slideToggle();
} else {
} else {
-
$('.click-nav .js ul').hide();
+
$('#loginBar .js ul').hide();
}
}
});
});

Revision as of 16:29, 27 January 2014