Template:Team:UNAM-Genomics Mexico/Templates/Main2
From 2010.igem.org
(Difference between revisions)
Line 173: | Line 173: | ||
{ | { | ||
text-align:left; | text-align:left; | ||
+ | } | ||
+ | |||
+ | .jqueryslidemenu{ | ||
+ | font: bold 12px Verdana; | ||
+ | background: #414141; | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .jqueryslidemenu ul{ | ||
+ | list-style-image:url("https://static.igem.org/mediawiki/2010/6/6e/UNAM-Genomics_Mexico_Spacer.gif"); | ||
+ | list-style-type: square; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | /*Top level list items*/ | ||
+ | .jqueryslidemenu ul li{ | ||
+ | position: relative; | ||
+ | display: inline; | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | /*Top level menu link items style*/ | ||
+ | .jqueryslidemenu ul li a{ | ||
+ | display: block; | ||
+ | background: #414141; /*background of tabs (default state)*/ | ||
+ | color: white; | ||
+ | padding: 8px 10px; | ||
+ | border-right: 1px solid #778; | ||
+ | color: #2d2b2b; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | * html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/ | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | .jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{ | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .jqueryslidemenu ul li a:hover{ | ||
+ | background: black; /*tab link background during hover state*/ | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | /*1st sub level menu*/ | ||
+ | .jqueryslidemenu ul li ul{ | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | display: block; | ||
+ | visibility: hidden; | ||
+ | } | ||
+ | |||
+ | /*Sub level menu list items (undo style from Top level List Items)*/ | ||
+ | .jqueryslidemenu ul li ul li{ | ||
+ | display: list-item; | ||
+ | float: none; | ||
+ | } | ||
+ | |||
+ | /*All subsequent sub menu levels vertical offset after 1st level sub menu */ | ||
+ | .jqueryslidemenu ul li ul li ul{ | ||
+ | top: 0; | ||
+ | } | ||
+ | |||
+ | /* Sub level menu links style */ | ||
+ | .jqueryslidemenu ul li ul li a{ | ||
+ | font: normal 13px Verdana; | ||
+ | width: 160px; /*width of sub menus*/ | ||
+ | padding: 5px; | ||
+ | margin: 0; | ||
+ | border-top-width: 0; | ||
+ | border-bottom: 1px solid gray; | ||
+ | } | ||
+ | |||
+ | .jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/ | ||
+ | background: #eff9ff; | ||
+ | color: black; | ||
+ | } | ||
+ | |||
+ | /* ######### CSS classes applied to down and right arrow images ######### */ | ||
+ | |||
+ | .downarrowclass{ | ||
+ | position: absolute; | ||
+ | top: 12px; | ||
+ | right: 7px; | ||
+ | } | ||
+ | |||
+ | .rightarrowclass{ | ||
+ | position: absolute; | ||
+ | top: 6px; | ||
+ | right: 5px; | ||
} | } | ||
</style> | </style> | ||
+ | |||
+ | |||
+ | <!--[if lte IE 7]> | ||
+ | <style type="text/css"> | ||
+ | html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/ | ||
+ | </style> | ||
+ | <![endif]--> | ||
+ | |||
+ | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
+ | /********************* | ||
+ | //* jQuery Multi Level CSS Menu #2- By Dynamic Drive: http://www.dynamicdrive.com/ | ||
+ | //* Last update: Nov 7th, 08': Limit # of queued animations to minmize animation stuttering | ||
+ | //* Menu avaiable at DD CSS Library: http://www.dynamicdrive.com/style/ | ||
+ | *********************/ | ||
+ | //Update: April 12th, 10: Fixed compat issue with jquery 1.4x | ||
+ | |||
+ | //Specify full URL to down and right arrow images (23 is padding-right to add to top level LIs with drop downs): | ||
+ | var arrowimages={down:['downarrowclass', 'https://static.igem.org/mediawiki/2010/c/cb/UNAM-Genomics_Mexico_team_down.gif', 23], right:['rightarrowclass', 'https://static.igem.org/mediawiki/2010/2/25/UNAM-Genomics_Mexico_team_right.gif']} | ||
+ | |||
+ | var jqueryslidemenu={ | ||
+ | |||
+ | animateduration: {over: 200, out: 100}, //duration of slide in/ out animation, in milliseconds | ||
+ | |||
+ | buildmenu:function(menuid, arrowsvar){ | ||
+ | jQuery(document).ready(function($){ | ||
+ | var $mainmenu=$("#"+menuid+">ul") | ||
+ | var $headers=$mainmenu.find("ul").parent() | ||
+ | $headers.each(function(i){ | ||
+ | var $curobj=$(this) | ||
+ | var $subul=$(this).find('ul:eq(0)') | ||
+ | this._dimensions={w:this.offsetWidth, h:this.offsetHeight, subulw:$subul.outerWidth(), subulh:$subul.outerHeight()} | ||
+ | this.istopheader=$curobj.parents("ul").length==1? true : false | ||
+ | $subul.css({top:this.istopheader? this._dimensions.h+"px" : 0}) | ||
+ | $curobj.children("a:eq(0)").css(this.istopheader? {paddingRight: arrowsvar.down[2]} : {}).append( | ||
+ | '<img src="'+ (this.istopheader? arrowsvar.down[1] : arrowsvar.right[1]) | ||
+ | +'" class="' + (this.istopheader? arrowsvar.down[0] : arrowsvar.right[0]) | ||
+ | + '" style="border:0;" />' | ||
+ | ) | ||
+ | $curobj.hover( | ||
+ | function(e){ | ||
+ | var $targetul=$(this).children("ul:eq(0)") | ||
+ | this._offsets={left:$(this).offset().left, top:$(this).offset().top} | ||
+ | var menuleft=this.istopheader? 0 : this._dimensions.w | ||
+ | menuleft=(this._offsets.left+menuleft+this._dimensions.subulw>$(window).width())? (this.istopheader? -this._dimensions.subulw+this._dimensions.w : -this._dimensions.w) : menuleft | ||
+ | if ($targetul.queue().length<=1) //if 1 or less queued animations | ||
+ | $targetul.css({left:menuleft+"px", width:this._dimensions.subulw+'px'}).slideDown(jqueryslidemenu.animateduration.over) | ||
+ | }, | ||
+ | function(e){ | ||
+ | var $targetul=$(this).children("ul:eq(0)") | ||
+ | $targetul.slideUp(jqueryslidemenu.animateduration.out) | ||
+ | } | ||
+ | ) //end hover | ||
+ | $curobj.click(function(){ | ||
+ | $(this).children("ul:eq(0)").hide() | ||
+ | }) | ||
+ | }) //end $headers.each() | ||
+ | $mainmenu.find("ul").css({display:'none', visibility:'visible'}) | ||
+ | }) //end document.ready | ||
+ | } | ||
+ | } | ||
+ | |||
+ | //build menu with ID="myslidemenu" on page: | ||
+ | jqueryslidemenu.buildmenu("myslidemenu", arrowimages) | ||
</script> | </script> | ||
+ | |||
+ | |||
+ | <script type="text/javascript"> | ||
+ | |||
+ | var _gaq = _gaq || []; | ||
+ | _gaq.push(['_setAccount', 'UA-11233600-2']); | ||
+ | _gaq.push(['_trackPageview']); | ||
+ | |||
+ | (function() { | ||
+ | var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; | ||
+ | ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; | ||
+ | var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); | ||
+ | })(); | ||
+ | |||
+ | </script | ||
</head> | </head> | ||
Line 186: | Line 356: | ||
<div id="maincontainer"> | <div id="maincontainer"> | ||
- | <div id="topsection"></ | + | <div id="topsection"> |
+ | <div id="myslidemenu" class="jqueryslidemenu"> | ||
+ | <ul> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico">Home</a></li> | ||
+ | <li><a href="#">Team</a> | ||
+ | <ul> | ||
+ | <li><a href="#">Us</a> | ||
+ | <ul> | ||
+ | <li><a href="https://igem.org/Team.cgi?id=360">Official Team Profile</a> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Team">Unofficial Team Profile</a> | ||
+ | </ul> | ||
+ | <li><a href="https://igem.org/Team_Wikis?year=2010">Them</a> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#">Project</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Project">Overview</a></li> | ||
+ | <li><a href="#">Whole-System View</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Parts">Parts created</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Modeling">Model created</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#">Individual Systems</a> | ||
+ | <ul> | ||
+ | <li><a href="#">Red->Green</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Red_Green/Description">Description</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Red_Green/Parts">Parts</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Red_Green/Model">Model</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#">Green->Blue</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Green_Blue/Description">Description</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Green_Blue/Parts">Parts</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Green_Blue/Model">Model</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#">Blue->Red</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Blue_Red/Description">Description</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Blue_Red/Parts">Parts</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Blue_Red/Model">Model</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Notebook">Official Notebook</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Safety">Safety</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/Collaboration">Collaboration</a></li> | ||
+ | <li><a href="#">About</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/About/iGEM">iGEM</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/About/Synthetic Biology">Synthetic Biology</a></li> | ||
+ | <li><a href="https://2010.igem.org/Team:UNAM-Genomics_Mexico/About/CCG">UNAM</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li></html><div>{{{Spanish}}}</div><html></li> | ||
+ | <li></html><div>{{{English}}}</div><html></li> | ||
+ | <li></html><div>{{{French}}}</div><html></li> | ||
+ | </ul> | ||
+ | <br style="clear: left" /> | ||
+ | </div> | ||
+ | |||
+ | <img src="https://static.igem.org/mediawiki/2010/4/41/UNAM-Genomics_Mexico_Logo_light_minimal_banner.png" /> | ||
+ | </div> | ||
<br /> | <br /> |
Revision as of 04:52, 2 August 2010
{{{Main_Content}}}
{{{Markup Content}}}
{{{Green_Content}}}
{{{Red_Content}}}
{{{Blue_Content}}}
This site is best viewed with a Webkit based Browser (eg: Google's Chrome, Apple's Safari),
or a Gecko one (eg: Mozilla's Firefox, Netscape). Some of the code requires an up-to-date browser.
It is worst viewed with Microsoft's Internet Explorer Browser. And we mean that. Sorry.