Template:Imperial2010/Header: Difference between revisions

From OpenWetWare
Jump to navigationJump to search
← Older editNewer edit →
No edit summary
No edit summary
Line 11: Line 11:
  $('#headover ul li a[href$="' + path + '"]').addClass("curlink");
  $('#headover ul li a[href$="' + path + '"]').addClass("curlink");
  var vCurlink = $('#headover ul li a[href$="' + path + '"]').attr("id");
  var vCurlink = $('#headover ul li a[href$="' + path + '"]').attr("id");
  $('#'+vCurlink+'.listhead').addClass('curlink');
  $('#'+vCurlink+'.listhead').addClass('blank');
  $('.curlink').css("color","#ea8828");
  $('.curlink').css("color","#ea8828");
});
});
Line 20: Line 20:


$('#menu').mouseleave(function() {
$('#menu').mouseleave(function() {
  $('.listhead,.listmain').not('.curlink').css("color","#dddddd");
  $('.listhead,.listmain').not('.curlink').css("color","#ffffff");
  $('#headover ul').fadeOut(500);
  $('#headover ul').fadeOut(200);
  $('#headover').stop().animate({height:'50px',top:'100px'},1000);
  $('#headover').stop().animate({height:'50px',top:'100px'},1000);
});
});


$('.listhead').mouseover(function(){
$('.listhead').mouseover(function(){
  $('.listhead').not('.curlink').css("color","#dddddd");
  $('.listhead').not('.curlink').css("color","#ffffff");
  $(this).css("color","#ea8828");
  $(this).css("color","#444444");
  $('#headover ul').css("display","none");
  $('#headover ul').css("display","none");
  var vActive = $(this).attr("id");
  var vActive = $(this).attr("id");
  $('.'+vActive).stop().fadeIn(500);
  $('.'+vActive).stop().fadeIn(200);
});
});


Line 98: Line 98:
     top: 0px;
     top: 0px;
     left: 0px;
     left: 0px;
     background-color: #495046}
     background-color: #ea8828}


   #headpic {
   #headpic {
Line 148: Line 148:
     text-decoration: none;
     text-decoration: none;
     font-family: helvetica, arial, sans-serif;
     font-family: helvetica, arial, sans-serif;
     color: #dddddd;}
     color: #ffffff;}


   #headover ul{
   #headover ul{

Revision as of 15:04, 24 September 2010

<html> 

<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
 <script type="text/javascript">
  $(document).ready(function(){

$(function(){ 

var path = location.pathname.substring(1);
if ( path )
$('#headover ul li a[href$="' + path + '"]').addClass("curlink");
var vCurlink = $('#headover ul li a[href$="' + path + '"]').attr("id");
$('#'+vCurlink+'.listhead').addClass('blank');
$('.curlink').css("color","#ea8828");

});

$('#menuback').mouseover(function() { 

$('#headover').stop().animate({height:'150px',top:'0px'},1000);

});

$('#menu').mouseleave(function() { 

$('.listhead,.listmain').not('.curlink').css("color","#ffffff");
$('#headover ul').fadeOut(200);
$('#headover').stop().animate({height:'50px',top:'100px'},1000);

});

$('.listhead').mouseover(function(){ 

$('.listhead').not('.curlink').css("color","#ffffff");
$(this).css("color","#444444");
$('#headover ul').css("display","none");
var vActive = $(this).attr("id");
$('.'+vActive).stop().fadeIn(200);

});

$('.listmain').mouseover(function(){ 

$('.listmain').not('.curlink').css("color","#dddddd");
$(this).css("color","#ea8828");

});

$('#headover').mouseleave(function(){ 

$('.listmain').not('.curlink').css("color","#dddddd");

}); 

  });
 </script>
 <style type="text/css">

  .firstHeading {
   display: none;}

  #content {
   width: 900px;
   font-family: helvetica, arial, sans-serif;
   color: #555555}

  #title {
   width:900px;
   height:50px;
   position: relative;
   top: 0px;
   left: 0px;}

  #implogo {
   width:190px;
   height:50px;
   position: absolute;
   top: 0px;
   left: 20px;
   background-image:url(http://openwetware.org/images/c/c9/Imperialigemimplogo.jpg);}

  #igemlogo {
   width:84px;
   height:50px;
   position:absolute;
   top:0px;
   left:260px;
   background-image:url(http://openwetware.org/images/9/9c/Imperialigemigemlogo.jpg);}

  #csynbilogo {
   width:205px;
   height:50px;
   position:absolute;
   top:0px;
   left:394px;
   background-image:url(http://openwetware.org/images/a/ac/Imperialigemcsynbilogo.jpg);}

  #menu {
   width:900px;
   height:150px;
   position: relative;
   top: 20px;
   left: 0px;}

  #menuback {
   width:100px;
   height:150px;
   position: absolute;
   top: 0px;
   left: 0px;
   background-color: #ea8828}

  #headpic {
   width:800px;
   height:150px;
   position: absolute;
   top: 0px;
   left: 100px;
   background-image: url('http://openwetware.org/images/5/54/Imperialigemheadone.jpg'); }

  #headover {
   width: 800px;
   height:50px;
   position: absolute;
   top: 100px;
   left: 0px;
   background: url(http://openwetware.org/images/d/d8/Imperialigemheadoverone.png) 0px 0px no-repeat; }

  a {
   outline:none;}

  #headtit{
   font-family: helvetica, arial, sans-serif;
   font-size: 1.2em;
   color: #ffffff;
   position: absolute;
   top: 0.5em;
   right: 1.4em;}

  .dark{
   color: #dddddd;}

  .highlight{
   color: #ea8828;}

  #menulist{
   position: absolute;
   top: 16px;
   left: 3px;
   list-style: none;}

  #menulist li{
   height: 30px;
   }

  #menulist li a{
   font-weight: 100;
   font-size: 1.2em;
   text-decoration: none;
   font-family: helvetica, arial, sans-serif;
   color: #ffffff;}

  #headover ul{
   list-style: none;
   display: none;
   position: absolute;
   top: 1.2em;
   left: 0.2em;
   }

  #headover ul ul{
   position: absolute;
   top:-0.2em;
   left: 15em;}

  #headover ul li{
   height: 2.4em;
   }

  #headover ul li a{
   font-weight: 100;
   font-size: 1.2em;
   text-decoration: none;
   font-family: helvetica, arial, sans-serif;
   color: #dddddd;}

 </style>
</head>
<body>

</body>

</html> <html> 

<head>
 <style type="text/css">
  #blank {
   height:70px;
   width: 900px;
 </style>
</head>
<body>

</body>

</html>

Retrieved from "https://openwetware.org/mediawiki/index.php?title=Template:Imperial2010/Header&oldid=457252"