Biomod/2012/TU Dresden/Nanosaurs/Home: Difference between revisions

From OpenWetWare
Jump to navigationJump to search
No edit summary
(Replacing page with '{{Template:intro}}')
Line 1: Line 1:
{{Template:intro}}
{{Template:intro}}
<html>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js" ></script>
<script type="text/javascript">
$(document).ready(function(){
$("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
});
</script>
<style type="text/css">
#featured{
width:400px;
padding-right:250px;
position:relative;
border:5px solid #ccc;
height:250px;
background:#fff;
}
#featured ul.ui-tabs-nav{
position:absolute;
top:0; left:400px;
list-style:none;
padding:0; margin:0;
width:250px;
}
#featured ul.ui-tabs-nav li{
padding:1px 0; padding-left:13px; 
font-size:12px;
color:#666;
}
#featured ul.ui-tabs-nav li img{
float:left; margin:2px 5px;
background:#fff;
padding:2px;
border:1px solid #eee;
}
#featured ul.ui-tabs-nav li span{
font-size:11px; font-family:Verdana;
line-height:18px;
}
#featured li.ui-tabs-nav-item a{
display:block;
height:60px;
color:#333;  background:#fff;
line-height:20px;
}
#featured li.ui-tabs-nav-item a:hover{
background:#f2f2f2;
}
#featured li.ui-tabs-selected{
background:url('images/selected-item.gif') top left no-repeat; 
}
#featured ul.ui-tabs-nav li.ui-tabs-selected a{
background:#ccc;
}
#featured .ui-tabs-panel{
width:400px; height:250px;
background:#999; position:relative;
}
#featured .ui-tabs-panel .info{
position:absolute;
top:180px; left:0;
height:70px;
background: url('images/transparent-bg.png');
}
#featured .info h2{
font-size:18px; font-family:Georgia, serif;
color:#fff; padding:5px; margin:0;
overflow:hidden;
}
#featured .info p{
margin:0 5px;
font-family:Verdana; font-size:11px;
line-height:15px; color:#f0f0f0;
}
#featured .info a{
text-decoration:none;
color:#fff;
}
#featured .info a:hover{
text-decoration:underline;
}
#featured .ui-tabs-hide{
display:none;
}
</style>
<head>
</head>
<body>
<h3>&raquo; Featured Content Slider Using jQuery</h3>
<div id="featured" >
  <ul class="ui-tabs-nav">
        <li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1"><a href="#fragment-1"><img src="images/chess1small.jpg" alt="" /><span>The board's set up, white move</span></a></li>
        <li class="ui-tabs-nav-item" id="nav-fragment-2"><a href="#fragment-2"><img src="images/chess2small.jpg" alt="" /><span>White king pawn moves 2 squares</span></a></li>
        <li class="ui-tabs-nav-item" id="nav-fragment-3"><a href="#fragment-3"><img src="images/chess3small.jpg" alt="" /><span>Black ditto</span></a></li>
        <li class="ui-tabs-nav-item" id="nav-fragment-4"><a href="#fragment-4"><img src="images/chess4small.jpg" alt="" /><span>White runner moves to third column</span></a></li>
      </ul>
    <!-- First Content -->
    <div id="fragment-1" class="ui-tabs-panel" style="">
<img src="images/chess1.jpg" alt="" />
<div class="info" >
<h2><a href="#" >The board's set up, white move</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tincidunt condimentum lacus. Pellentesque ut diam....<a href="#" >read more</a></p>
</div>
    </div>
    <!-- Second Content -->
    <div id="fragment-2" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/chess2.jpg" alt="" />
<div class="info" >
<h2><a href="#" >White king pawn moves 2 squares</a></h2>
<p>Vestibulum leo quam, accumsan nec porttitor a, euismod ac tortor. Sed ipsum lorem, sagittis non egestas id, suscipit....<a href="#" >read more</a></p>
</div>
    </div>
    <!-- Third Content -->
    <div id="fragment-3" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/chess3.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Black ditto</a></h2>
<p>liquam erat volutpat. Proin id volutpat nisi. Nulla facilisi. Curabitur facilisis sollicitudin ornare....<a href="#" >read more</a></p>
        </div>
    </div>
    <!-- Fourth Content -->
    <div id="fragment-4" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/chess4.jpg" alt="" />
<div class="info" >
<h2><a href="#" >White runner moves to third column</a></h2>
<p>Quisque sed orci ut lacus viverra interdum ornare sed est. Donec porta, erat eu pretium luctus, leo augue sodales....<a href="#" >read more</a></p>
        </div>
    </div>
</div>
</div>
</body>
</html>

Revision as of 14:57, 6 October 2012

<html>

<!--Define meta tag content and encoding--> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!--Start of javascripts, import jquery libraries--> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type"text/javascript">

// Main function that waits for the browser to be ready $(document).ready(function(){

   // Define click function on the submenues
   $('ul#top-menu li a').hover(function(){
   
        // Define slide down function for the submenues
        $(this).parent().find("ul.sub-menu").slideDown('fast').show();
   
   // Hover function 
   $(this).parent().hover(function(){
   }, function(){
       
        // Set the submenu to slide up when hovering out
        $(this).parent().find("ul.sub-menu").slideUp('slow');
     });
 });

}); </script>


<!--Start of CSS modifications to base homepage given by Harvard/Wyss Institute --> <style type="text/css">

body{background-color: white;}

  1. p-personal{display:none;}
  1. sidebar-main{
             display:none;
             widtht: 0px;
             left: 0px;

}

h1.firstHeading{

               display: none;

}


  1. content{
        margin: 35px 15% 0px 15%;
        padding: 10px 10px 10px 10px;         
        background-color: #C0C0C0;

}

  1. p-cactions{position: absolute;
         top: 10px;
         left: 0px;
         font-size: 14px;          

}

  1. footer{ position: relative;
         bottom: 0px; 

}


  1. contentSub{
               position: absolute;
               font-size:20px;

right: 0%; top: -10%;

               z-index: 5;
  }

</style> <!-- End of modifications to base homepage -->

<!-- Start of our CSS --> <style type="text/css">

/*Specs for Dresden pic in the header*/

  1. dresden-pic{
            position: absolute;
            top: 0px;
            right: 0px;
            width: 70%;
            height: 250px;

}

/*Team logo specs*/

  1. team-logo{
            position: absolute;
            top: 0px;
            left: 0px;  
            width: 30%;
            font-size: 44px; 
            color: #0066CC;     
            background: #0066CC;     

}

/*General menu bar specs*/ ul#top-menu{

            position: absolute;
            top: 250px;
            left: 0px;
            list-style: none; 
            padding: 0px 0px 0px 0px;
            margin: 0px 0px 0px 0px;             
            width: 100%;
            background: #3D3D3D;
            float: left;
            font-size: 22px;  
            /*background: url(exports-hal/users/studenthome/gscanon/Downloads/MgCl2ConcGel.png) repeat-x;*/ /*Optionalimage*/           

}

/*Particular specs for the list comprised in the menu*/ ul#top-menu li{

            margin: 0px;
            padding: 0px 0px 0px 0px;
            float: left;
            position: relative;

}

/*Specs for the links in the menu*/ ul#top-menu li a{

            padding: 5px 20px 5px 20px;
            color: #fff;
            display: block;
            float: left;   
            text-decoration: none;          

}

/*Hover effect for the links in the menu*/ ul#top-menu li a:hover{

            /*background: url(Downloads/JQueryDropdownMenu/topnav_hover.gif) repeat-x;*/ /*Optional image*/   
            background: #4ECC63;             

}


/*Specs for the submenues*/ ul#top-menu li ul.sub-menu{

            list-style: none;
            position: absolute;
            top: 40px; left: 0px;
            background: #3D3D3D;
            margin: 0; padding: 0;
            display: none;
            float: left;
            width: 170px;
            border: 1px solid #111;  
            z-index: 5;           

}

/*Specs for the list in the submenu*/ ul#top-menu li ul.sub-menu li{

            margin: 0; padding: 0;
            border-top: 1px solid #252525;
            border-bottom: 1px solid #444;
            clear: both;
            width: 170px;               

{

/*Specs for the links in the submenues*/ ul#top-menu li ul.sub-menu li a{

            color: #fff;
            float: left;
            width: 145px;
            padding-left: 20px;             

}

/*Hover effect for the submenues*/ ul#top-menu li ul.submenu li a{

            background: #4ECC63;

}

</style> <!-- End of our CSS -->


<head>


</head> <body>

<div id="dresden-pic"> <img src="http://openwetware.org/images/3/39/DresdenNight.png" alt="Panorama of Dresden at night" width="100%" height="100%" /> </div>

<div id="team-logo"> <p> TEAM LOGO </p> <p> :)  :)  :)  :) :) :)</p> <p> :)  :)  :)  :) :) :)</p> </div>


<ul id="top-menu"> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Home">Home</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Team">Team</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Idea">Project</a>

   <ul class="sub-menu">
       <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Idea">Idea</a></li>
       <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Description">Description</a></li>
       <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Theory">Theory</a></li>
       <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Results">Results</a></li>
       <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/References">References</a></li>
   </ul>    

</li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Notebook">Notebook</a>

   <ul class="sub-menu">
       <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Notebook/Meetings">Meetings</a></li>
       <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Notebook/Lab_Protocols">Lab Protocols</a></li>        
   </ul> 

</li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Outreach">Outreach</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Gallery">Gallery</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Sponsors">Sponsors</a></li> </ul>

<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>

</body> </html>