Team:Heidelberg/StartPage Test

From 2013.igem.org

(Difference between revisions)

@@ Line 8: / Line 8: @@
              <div class="item team">
-                 <img class="circle" alt="" src="images/Team_bg2.png" style="opacity: 0.1; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
+                 <img class="circle" alt="" src="images/Team_bg2.png" style="opacity: 0; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
                  <a class="icon" href="#"></a>
                  <h2 class="">Team</h2>
@@ Line 17: / Line 17: @@
                  </ul>
              </div>
-           <div class="item project">
+            <div class="item project">
-                 <img class="circle" alt="" src="images/Project_bg.png" style="opacity: 0.1; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
+                 <img class="circle" alt="" src="images/Project_bg.png" style="opacity: 0; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
                  <a class="icon" href="#"></a>
                  <h2 class="">Project</h2>
@@ Line 29: / Line 29: @@
              </div>
              <div class="item notebook">
-                 <img class="circle" alt="" src="images/Notebook_bg2.png" style="opacity: 0.1;width: 52px; height: 52px;" height="199" width="199">
+                 <img class="circle" alt="" src="images/Notebook_bg2.png" style="opacity: 0; width: 52px; height: 52px;" height="199" width="199">
                  <a class="icon" href="#"></a>
@@ Line 40: / Line 40: @@
              </div>
              <div class="item parts">
-                 <img class="circle" alt="" src="images/Notebook_bg.png" height="199" width="199">
+                 <img class="circle" alt="" src="images/Notebook_bg.png" style="opacity: 0; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
                  <a class="icon" href="#"></a>
                  <h2>Parts</h2>
@@ Line 49: / Line 49: @@
              </div>
              <div class="item software">
-                 <img class="circle" alt="" src="images/Notebook_bg.png" style="opacity: 0.1; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
+                 <img class="circle" alt="" src="images/Notebook_bg.png" style="opacity: 0; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
                  <a class="icon" href="#"></a>
                  <h2 class="">Software</h2>
@@ Line 58: / Line 58: @@
              </div>
              <div class="item human">
-                 <img class="circle" alt="" src="images/Human_bg.png" height="199" width="199">
+                 <img class="circle" alt="" src="images/Human_bg.png" style="opacity: 0; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
                  <a class="icon" href="#"></a>
                  <h2>Human Practice</h2>
@@ Line 67: / Line 67: @@
              </div>
              <div class="item safety">
-                 <img class="circle" alt="" src="images/Notebook_bg.png" height="199" width="199">
+                 <img class="circle" alt="" src="images/Notebook_bg.png" style="opacity: 0; width: 52px; height: 52px; top: 0px; left: 0px;" height="199" width="199">
                  <a class="icon" href="#"></a>
                  <h2>Safety</h2>
@@ Line 75: / Line 75: @@
                  </ul>
              </div>
-			<img alt="" src="images/try-bg3.png">
+			<img src="images/start_background.png" style="z-index:-1">
          </div>
-		<div class="item logo col-md-4">
+		<div class="col-md-4">
-                    <img id='logo' alt="" src="images/iGEM_StartLogo.png" height="173" width="400">
+            <img id='logo' alt="" src="images/iGEM_StartLogo.png" height="173" width="400" style="margin-right:10px; margin-top:10px">
-		 			<div class='row'>
+            <a href="http://www.facebook.com..."><img src="fb.png" height="50" style="float:right; margin-right:10px"/></a>
-						<div class='col-md-8 col-md-offset-2' id='WelcomeText'>
+            <a href="http://www.twitter.com..."><img src="tw.png"height="50" style="float:right; margin-right:10px "/></a>
-					 	<p>For centuries, alchemists believed in the existence of the Philosopher’s Stone, a mysterious substance not only able to turn common metals into precious ones, such as silver and gold, but even capable of fulfilling mankind’s ultimate desires: rejuvenation and immortality.
+            <span style="margin-left:30%; margin-top:37%; font-family:Arial, sans-serif" class="btn btn-default btn-lg btn-popover" data-content="For centuries, alchemists believed in the existence of the Philosopher’s Stone, a mysterious substance not only able to turn common metals into precious ones, such as silver and gold, but even capable of fulfilling mankind’s ultimate desires: rejuvenation and immortality.
-						Although the Philosopher’s Stone has never been found, the quest for it has pushed alchemists to test in their laboratories numerous substances and their interactions, building up a solid knowledge that can be found nowadays in the sciences of chemistry, metallurgy and pharmacology. </br>
+            Although the Philosopher’s Stone has never been found, the quest for it has pushed alchemists to test in their laboratories numerous substances and their interactions, building up a solid knowledge that can be found nowadays in the sciences of chemistry, metallurgy and pharmacology. </br>
-						Living in the 21st century research-driven world, our belief in the Philosopher’s Stone has faded. Yet we are, now as ever, still on a quest, looking for solutions not only to help individuals live long and healthy, but also to solve the ecological problems we ourselves have created in the course of modernization. Contrary to the past, we now believe that we should not simply look for magical substances hidden somewhere in nature, rather we shall be inspired by it and create new tools for actively addressing the challenges of our society.</br>
+            Living in the 21st century research-driven world, our belief in the Philosopher’s Stone has faded. Yet we are, now as ever, still on a quest, looking for solutions not only to help individuals live long and healthy, but also to solve the ecological problems we ourselves have created in the course of modernization. Contrary to the past, we now believe that we should not simply look for magical substances hidden somewhere in nature, rather we shall be inspired by it and create new tools for actively addressing the challenges of our society.</br>
-						Let us take you on a journey where you will meet a new class of molecules that holds the potential to revolutionize synthetic biology: the non-ribosomal peptide synthetases. We will teach you how to unlock their enormous potential for generating entirely synthetic peptides with various, customized functions, such as recycling gold from electronic waste.
+            Let us take you on a journey where you will meet a new class of molecules that holds the potential to revolutionize synthetic biology: the non-ribosomal peptide synthetases. We will teach you how to unlock their enormous potential for generating entirely synthetic peptides with various, customized functions, such as recycling gold from electronic waste.
-				</br></br>
+            </br></br>
-						Take your chance!</br>
+            Take your chance!</br>
-						Join our quest!
+            Join our quest!" title="" data-tigger="click" data-title="Welcome!">Welcome! Click here!</span>
+            <h3 style="float:right; margin-right:10px">Check out our Highlights:</h3>
-						 </p>
-					</div>
-					</div>
 		</div>
 	<div>
-  <!-- The JavaScript -->
-        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
-        <script src="jquery.easing.1.3.js" type="text/javascript"></script>
-        <script type="text/javascript">
-            $(function() {
-                $('#nav > div').hover(
-                function () {
-                    var $this = $(this);
-                    $this.find('img').stop().animate({
-                        'width'     :'250px',
-                        'height'    :'250px',
-                        'top'       :'-25px',
-                        'left'      :'-25px',
-                        'opacity'   :'3.0',
-                    },500,'easeOutBack',function(){
-                        $(this).parent().find('ul').fadeIn(300);
-                    });
-					$this.find('img').css('z-index', '1');
-                    $this.find('a:first,h2,ul').addClass('active');
-                },
-                function () {
-                    var $this = $(this);
-                    $this.find('ul').fadeOut(500);
-                    $this.find('img').stop().animate({
-                        'width'     :'52px',
-                        'height'    :'52px',
-                        'top'       :'0px',
-                        'left'      :'0px',
-                        'opacity'   :'0.1',
-                    },1000,'easeOutBack');
-                    $this.find('a:first,h2,ul').removeClass('active');
-                }
-            );
-            });
-        </script>
 </html>

Team:Heidelberg/StartPage Test

From 2013.igem.org

Revision as of 21:25, 2 October 2013

Team

Project

Notebook

Parts

Software

Human Practice

Safety

Check out our Highlights: