Team:METU-Ankara/Extras

From 2011.igem.org

(Difference between revisions)
Line 7: Line 7:
     <meta name="language" content="en" />
     <meta name="language" content="en" />
-
     <link href="css/all.css" rel="stylesheet" type="text/css" media="all" />
+
     <style>
 +
/*
 +
*  nmcDropDown example
 +
*  Site by New Media Campaigns
 +
*/
 +
 
 +
/* Eric Meyer's Reset styles */
 +
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}:active{outline:0;}ins{text-decoration:none;}del{text-decoration:line-through;}table{border-collapse:collapse;border-spacing:0;}
 +
 
 +
 
 +
/* Begin general styles */
 +
 
 +
html {
 +
  background: #eee;
 +
  }
 +
 
 +
body {
 +
font-size: 87.5%;    /* Reset base size to 14px */
 +
line-height: 1.43em; /* Reset line height to 20px */
 +
}
 +
 
 +
#wrapper {
 +
width: 800px;
 +
margin: 0 auto;
 +
}
 +
 +
body, h1, h2 {
 +
font-family: Helvetica, Arial, Geneva, sans-serif;
 +
}
 +
 +
p {
 +
  padding-bottom: 1.43em;
 +
}
 +
 +
a:link, a:visited {
 +
  color: #3333cc;
 +
  text-decoration: none;
 +
}
 +
a:focus, a:hover, a:active {
 +
  text-decoration: underline;
 +
}
 +
 
 +
h1 {
 +
  font-size: 1.43em;
 +
}
 +
 +
h2 {
 +
  font-size: 1.14em;
 +
}
 +
 
 +
/* End text */
 +
 
 +
 
 +
/* Begin header styles */
 +
 
 +
#header {
 +
  float: left;
 +
  width: 100%;
 +
  height: 60px;
 +
  }
 +
 
 +
#logo a {
 +
  float: left;
 +
  padding: 20px 0;
 +
}
 +
 
 +
#nav {
 +
float: right;
 +
margin: 15px 0;
 +
padding: 0 20px;
 +
height: 30px;
 +
background: #ccc;
 +
border: 1px solid #bbb;
 +
-webkit-border-radius: 4px;
 +
-moz-border-radius: 4px;
 +
border-radius: 4px;
 +
}
 +
#nav li {
 +
float: left;
 +
position: relative;
 +
}
 +
#nav li.open, #nav li:hover {
 +
  background: #bbb;
 +
  }
 +
#nav li a {
 +
display: block;
 +
padding: 5px 25px;
 +
line-height: 20px;
 +
color: #444;
 +
text-decoration: none;
 +
}
 +
#nav li ul {
 +
  display: none;
 +
  position: absolute;
 +
  top: 30px;
 +
  left: 0;
 +
  width: 130px;
 +
  padding: 0 0 5px;
 +
  background: #bbb;
 +
  border: solid #bbb;
 +
  border-width: 0 1px 1px;
 +
  -webkit-border-bottom-left-radius: 4px;
 +
  -webkit-border-bottom-right-radius: 4px;
 +
  -moz-border-radius-bottomleft: 4px;
 +
  -moz-border-radius-bottomright: 4px;
 +
  border-bottom-left-radius: 4px;
 +
  border-bottom-right-radius: 4px;
 +
  -webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.15);
 +
  -moz-box-shadow: 0 3px 3px rgba(0,0,0,0.15);
 +
  box-shadow: 0 3px 3px rgba(0,0,0,0.15);
 +
  }
 +
#nav li:hover ul {
 +
  display: block;
 +
  }
 +
#nav li ul li {
 +
  float: none;
 +
  }
 +
#nav li ul li a {
 +
  padding: 8px 10px;
 +
  display: inline-block;
 +
  }
 +
#nav li ul li a {display: block;}
 +
#nav li ul li a:hover {
 +
  background: #444;
 +
  color: #bbb;
 +
  }
 +
 
 +
/* End header */
 +
 
 +
 
 +
/* Begin Sidebar */
 +
 
 +
#sidebar {
 +
  float: right;
 +
  width: 180px;
 +
  }
 +
 
 +
#sidebarNav {
 +
padding: 10px 0;
 +
background: #ccc;
 +
border: 1px solid #bbb;
 +
-webkit-border-radius: 4px;
 +
-moz-border-radius: 4px;
 +
border-radius: 4px;
 +
}
 +
#sidebarNav li {
 +
  border-top: 0 solid #ccc;
 +
  }
 +
#sidebarNav li:hover, #sidebarNav li.open {
 +
  background: #bbb;
 +
  }
 +
#sidebarNav li a {
 +
display: block;
 +
padding: 5px 10px;
 +
line-height: 20px;
 +
color: #444;
 +
font-weight: bold;
 +
text-decoration: none;
 +
  display: inline-block;
 +
  }
 +
#sidebarNav li a {display: block;}
 +
#sidebarNav li p {
 +
  display: none;
 +
  padding: 5px 10px 10px;
 +
color: #444;
 +
border-top: 1px dashed #aaa;
 +
  }
 +
#sidebarNav li:hover p {
 +
  display: block;
 +
  }
 +
 
 +
/* End Sidebar */
 +
 
 +
 
 +
/* Begin body styles */
 +
 
 +
#body {
 +
  float: left;
 +
  clear: both;
 +
  width: 600px;
 +
}
 +
 +
/* End body */
 +
</style>
     <!--[if IE 7]><link href="css/ie7.css" rel="stylesheet" type="text/css" media="all" /><![endif]-->
     <!--[if IE 7]><link href="css/ie7.css" rel="stylesheet" type="text/css" media="all" /><![endif]-->
     <!--[if IE 6]><link href="css/ie6.css" rel="stylesheet" type="text/css" media="all" /><![endif]-->
     <!--[if IE 6]><link href="css/ie6.css" rel="stylesheet" type="text/css" media="all" /><![endif]-->
Line 13: Line 196:
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
     <script type="text/javascript">
     <script type="text/javascript">
-
$(document).ready(function() {
+
$(document).ready(function() {
        
        
// Setup the nav drop-downs
// Setup the nav drop-downs
Line 49: Line 232:
*/
*/
(function($){$.fn.hoverIntent=function(f,g){var cfg={sensitivity:7,interval:100,timeout:0};cfg=$.extend(cfg,g?{over:f,out:g}:f);var cX,cY,pX,pY;var track=function(ev){cX=ev.pageX;cY=ev.pageY;};var compare=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);if((Math.abs(pX-cX)+Math.abs(pY-cY))<cfg.sensitivity){$(ob).unbind("mousemove",track);ob.hoverIntent_s=1;return cfg.over.apply(ob,[ev]);}else{pX=cX;pY=cY;ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}};var delay=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);ob.hoverIntent_s=0;return cfg.out.apply(ob,[ev]);};var handleHover=function(e){var p=(e.type=="mouseover"?e.fromElement:e.toElement)||e.relatedTarget;while(p&&p!=this){try{p=p.parentNode;}catch(e){p=this;}}if(p==this){return false;}var ev=jQuery.extend({},e);var ob=this;if(ob.hoverIntent_t){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);}if(e.type=="mouseover"){pX=ev.pageX;pY=ev.pageY;$(ob).bind("mousemove",track);if(ob.hoverIntent_s!=1){ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}}else{$(ob).unbind("mousemove",track);if(ob.hoverIntent_s==1){ob.hoverIntent_t=setTimeout(function(){delay(ev,ob);},cfg.timeout);}}};return this.mouseover(handleHover).mouseout(handleHover);};})(jQuery);
(function($){$.fn.hoverIntent=function(f,g){var cfg={sensitivity:7,interval:100,timeout:0};cfg=$.extend(cfg,g?{over:f,out:g}:f);var cX,cY,pX,pY;var track=function(ev){cX=ev.pageX;cY=ev.pageY;};var compare=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);if((Math.abs(pX-cX)+Math.abs(pY-cY))<cfg.sensitivity){$(ob).unbind("mousemove",track);ob.hoverIntent_s=1;return cfg.over.apply(ob,[ev]);}else{pX=cX;pY=cY;ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}};var delay=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);ob.hoverIntent_s=0;return cfg.out.apply(ob,[ev]);};var handleHover=function(e){var p=(e.type=="mouseover"?e.fromElement:e.toElement)||e.relatedTarget;while(p&&p!=this){try{p=p.parentNode;}catch(e){p=this;}}if(p==this){return false;}var ev=jQuery.extend({},e);var ob=this;if(ob.hoverIntent_t){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);}if(e.type=="mouseover"){pX=ev.pageX;pY=ev.pageY;$(ob).bind("mousemove",track);if(ob.hoverIntent_s!=1){ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}}else{$(ob).unbind("mousemove",track);if(ob.hoverIntent_s==1){ob.hoverIntent_t=setTimeout(function(){delay(ev,ob);},cfg.timeout);}}};return this.mouseover(handleHover).mouseout(handleHover);};})(jQuery);
-
</script>
+
 +
</script>
</head>
</head>

Revision as of 23:16, 5 August 2011

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> nmcDropDown Example Page

Page Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam eu metus velit. Sed felis sem, venenatis at ullamcorper a, ornare sit amet nunc. Nunc id massa turpis. In dolor dui, ultricies sit amet mattis vel, cursus non eros. Pellentesque ut mi arcu, ac scelerisque dolor. Phasellus neque nibh, tincidunt quis mattis vel, scelerisque et metus.

Nullam fermentum pulvinar porta. In hac habitasse platea dictumst. Phasellus non nunc diam, in lacinia dolor. Cras nec eros in metus elementum rhoncus. Phasellus viverra malesuada est, eu pharetra sapien mollis at.

Nam accumsan dui at neque malesuada

Curabitur vitae neque a lacus malesuada porta. Sed non condimentum risus. Nam malesuada, erat quis facilisis consectetur, neque felis varius ante, vel egestas dui urna a diam.

Retrieved from "http://2011.igem.org/Team:METU-Ankara/Extras"