Biomod/2011/IITM/AcidArtists/new page: Difference between revisions
No edit summary |
No edit summary |
||
Line 32: | Line 32: | ||
#menu ul li{float:left; width:125px; text-align:center; background:#234ade; margin:5px;} | #menu ul li{float:left; width:125px; text-align:center; background:#234ade; margin:5px;} | ||
#content_container{width:1%;height:10px; background:#234ade; position:absolute; top:150px; display:none;} | #content_container{width:1%;height:10px; background:#234ade; position:absolute; top:150px; display:none; left:495%} | ||
</style> | </style> | ||
Line 42: | Line 42: | ||
$(".link").mouseover(function(){ | $(".link").mouseover(function(){ | ||
if(flag==0){ | if(flag==0){ | ||
$("#content_container").show().animate({"width":"95%"}).animate({"height":"400px"}); | $("#content_container").show().animate({"width":"95%","left":0}).animate({"height":"400px"}); | ||
flag==1; | flag==1; | ||
} | } |
Revision as of 06:40, 27 October 2011
<html> <head> <style>
- bodyContent{text-align:center;}
- content{
color:white; background:black; border:none; } .portlet .pBody { border:none; background-color: black; } .portlet a{color:white;} .pBody a{color:white;}
- footer{background:black; border:none;}
- footer li{color:white;}
- footer li a {color:white;}
body{
background:black;
color:white;
}
h1, h2, h3, h4, h5, h6, p, a, pre{color:white;}
- menu ul{list-style:none;}
- menu ul li{float:left; width:125px; text-align:center; background:#234ade; margin:5px;}
- content_container{width:1%;height:10px; background:#234ade; position:absolute; top:150px; display:none; left:495%}
</style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"/></script> <script type="text/javascript"> jQuery(document).ready(function($){ var flag=0;
$(".link").mouseover(function(){ if(flag==0){ $("#content_container").show().animate({"width":"95%","left":0}).animate({"height":"400px"}); flag==1; } });
}); </script>
</head> <body> <h1>Acid Artists</h1> <div id="menu"> <ul> <li id="l1" class="link">Project</li> <li id="l2" class="link">Team</li> <li id="l3" class="link">Work diary</li> <li id="l4" class="link">Brain storming</li> <li id="l5" class="link">Reference papers</li> <li id="l6" class="link">To do list</li> <li id="l7" class="link">Resources</li> </ul> </div>
<div id="content_container"></div>
<div id="project" class="contents"></div> <div id="team" class="contents"></div> <div id="work_diary" class="contents"></div> <div id="brain_storming" class="contents"></div> <div id="ref_papers" class="contents"></div> <div id="to_do" class="contents"></div> <div id="resources" class="contents"></div>
</body>
</html>