|
|
(313 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
| + | __NOTOC__ |
- | <html xmlns="http://www.w3.org/1999/xhtml"> | + | {{TU-Delft_css}} |
- | <head> | + | <html> |
- | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
| + | <div id="header"> |
- | <title>Multi Level Hierarchical jQuery Menu: jQSimpleMenu</title>
| + | <a href="https://2012.igem.org/Main_Page" target="_blank"><img src="https://static.igem.org/mediawiki/2010/b/b3/ETHZ_Basel_header_left.png"></a><a href="https://2012.igem.org/Team:TU-Delft/Modeling"><img src="https://static.igem.org/mediawiki/igem.org/c/cd/SnifShrek.png"></a> |
- | <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
| + | </div> |
- | <script type="text/javascript" src="https://static.igem.org/mediawiki/2012/d/da/JqsimplemenuJavaScript.txt"></script>
| + | |
- | <link rel="stylesheet" href="" type="text/css" media="screen" />
| + | |
- | <script type="text/javascript">
| + | |
- | $(document).ready(function () {
| + | |
- | $('.menu').jqsimplemenu();
| + | |
- | });
| + | |
- | </script>
| + | |
- | <style type="text/css">
| + | |
- | .menu, .menu ul
| + | |
- | {
| + | |
- | margin: 0;
| + | |
- | padding: 0;
| + | |
- | list-style-type: none;
| + | |
- | position: relative;
| + | |
- | line-height: 2.5em;
| + | |
- | }
| + | |
- | .menu a
| + | |
- | {
| + | |
- | text-decoration: none;
| + | |
- | }
| + | |
- | .menu > li
| + | |
- | {
| + | |
- | margin-left: 15px;
| + | |
- | }
| + | |
- | .menu > li:first
| + | |
- | {
| + | |
- | margin-left:0px!important;
| + | |
- | }
| + | |
- | .menu > li > a
| + | |
- | {
| + | |
- | padding: 0px 10px;
| + | |
- | margin: 0;
| + | |
- | width: 100%;
| + | |
- | text-decoration: none;
| + | |
- | color: #838383;
| + | |
- | font-weight: bold;
| + | |
- | }
| + | |
- | div.box
| + | |
- | {
| + | |
- | position: absolute;
| + | |
- | z-index: -1;
| + | |
- | background-color: #75CDD2;
| + | |
- | left: 0;
| + | |
- | top: 0;
| + | |
- | border-radius: 4px 4px 0px 0px;
| + | |
- | -moz-border-radius: 4px 4px 0px 0px;
| + | |
- | -webkit-border-radius: 4px 4px 0px 0px;
| + | |
- | }
| + | |
- | li.pull-down
| + | |
- | {
| + | |
- | padding-right:6px;
| + | |
- | }
| + | |
- | li.pull-down > a
| + | |
- | {
| + | |
- | background-image: url('../images/darrow.png');
| + | |
- | background-position: 96% 75%;
| + | |
- | background-repeat: no-repeat;
| + | |
- | padding-right: 20px;
| + | |
- | }
| + | |
- | li.right-menu > a
| + | |
- | {
| + | |
- | background-image: url('../images/rarrow.png');
| + | |
- | background-position: 97% 45%;
| + | |
- | background-repeat: no-repeat;
| + | |
- | }
| + | |
- | .menu a.selected
| + | |
- | {
| + | |
- | background-color: #75CDD2;
| + | |
- | border-radius: 0px 4px 4px 4px;
| + | |
- | -moz-border-radius: 0px 4px 4px 4px;
| + | |
- | -webkit-border-radius: 0px 4px 4px 4px;
| + | |
- | }
| + | |
- | .menu li
| + | |
- | {
| + | |
- | float: left;
| + | |
- | position: relative;
| + | |
- | }
| + | |
- | | + | |
- | .menu ul
| + | |
- | {
| + | |
- | position: absolute;
| + | |
- | display: none;
| + | |
- | width: 200px;
| + | |
- | top: 2.5em; /*padding-right: 10px;*/
| + | |
- | background-color: #75CDD2; /*-moz-opacity: .50; filter: alpha(opacity=50); opacity: .50;*/
| + | |
- | border-radius: 0px 4px 4px 4px;
| + | |
- | -moz-border-radius: 0px 4px 4px 4px;
| + | |
- | -webkit-border-radius: 0px 4px 4px 4px;
| + | |
- | }
| + | |
- | | + | |
- | .menu li ul a
| + | |
- | {
| + | |
- | width: 180px;
| + | |
- | height: auto;
| + | |
- | float: left;
| + | |
- | color: #FFFEFD;
| + | |
- | padding: 0 10px;
| + | |
- | }
| + | |
- | .menu li ul li
| + | |
- | {
| + | |
- | padding: 0;
| + | |
- | margin: 0;
| + | |
- | }
| + | |
- | .menu ul ul
| + | |
- | {
| + | |
- | top: auto;
| + | |
- | }
| + | |
- | | + | |
- | .menu li ul ul
| + | |
- | {
| + | |
- | left: 198px; /*margin: 0px 0 0 10px;*/
| + | |
- | }
| + | |
- | .menu-item-selected > a
| + | |
- | {
| + | |
- | background-color: #FFFEFD;
| + | |
- | -moz-opacity: .50;
| + | |
- | filter: alpha(opacity=50);
| + | |
- | opacity: .50;
| + | |
- | }
| + | |
- | .menu-item-selected > a:hover
| + | |
- | {
| + | |
- | color: #257E84 !important;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | | + | |
- | body
| + | |
- | {
| + | |
- | font-size: 12px;
| + | |
- | font-family: Arial;
| + | |
- | }
| + | |
- | </style>
| + | |
- | </head>
| + | |
- | <body>
| + | |
- | <ul class="menu">
| + | |
- | <li><a href="http://www.egrappler.com">Home</a></li>
| + | |
- | <li><a href="http://www.egrappler.com/about">About</a></li>
| + | |
- | <li><a href="#">Services </a>
| + | |
- | <ul>
| + | |
- | <li><a href="#">Sofware Development</a>
| + | |
- | <ul>
| + | |
- | <li><a href="#">Web Apps</a></li>
| + | |
- | <li><a href="#">Widgets</a>
| + | |
- | <ul>
| + | |
- | <li><a href="#">jQuery Plugins</a></li>
| + | |
- | <li><a href="#">Asp.NET Controls</a></li>
| + | |
- | <li><a href="#">Salesforce Integration</a> </li>
| + | |
- | </ul>
| + | |
- | </li>
| + | |
- | </ul>
| + | |
- | </li>
| + | |
- | <li><a href="#">Interface Design</a></li>
| + | |
- | <li><a href="#">Technical Writing</a></li>
| + | |
- | <li><a href="#">Resume Writing</a></li>
| + | |
- | </ul>
| + | |
- | </li>
| + | |
- | <li><a href="#">Portfolio</a>
| + | |
- | <ul>
| + | |
- | <li><a href="#">Web Appliations</a></li>
| + | |
- | <li><a href="#">SaaS</a></li>
| + | |
- | <li><a href="#">Windows Applications</a></li>
| + | |
- | <li><a href="#">Mobile Applications</a></li>
| + | |
- | <li><a href="#">Server Applications</a> </li>
| + | |
- | </ul>
| + | |
- | </li>
| + | |
- | <li><a href="http://www.egrappler.com">Blog</a></li>
| + | |
- | <li><a href="http://www.egrappler.com">Contact</a></li>
| + | |
- | </ul>
| + | |
- | </body>
| + | |
| </html> | | </html> |
| + | {{:Team:TU-Delft/Templates/Header/Menu}} |