Team:UANL Mty-Mexico/Team

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
{{:Team:UANL_Mty-Mexico/Navbar}}
{{:Team:UANL_Mty-Mexico/Navbar}}
-
<html>
+
<html>  
-
<script>$('#example').popover(options)</script>
+
  <head>
-
<body data-spy="scroll" data-target="#navbar-example">
+
  <body>
-
<!-- START THE FEATURETTES -->
+
      <div class="container">
 +
<!-- Students -->
-
<a href="#" class="btn btn-lg btn-danger" data-toggle="popover" title="" data-content="And here's some amazing content. It's very engaging. right?" data-original-title="A Title">Click to toggle popover</a>
+
<h3><span class="text-muted">Meet the students</span></h3><hr>
-
      <hr class="featurette-divider">
+
<div class="row">
-
 
+
<div class="col-md-3">
-
      <div class="row featurette">
+
            <a href="javascript:;" id="1" rel="popover" data-placement="left" data-content="He'll blow your mind." data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
-
        <div class="col-md-7">
+
</div>
-
          <h2 class="featurette-heading">Miguel Loera Sánchez. <span class="text-muted">He'll blow your mind.</span></h2>
+
<div class="col-md-3">
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
            <a href="javascript:;"id="2" data-placement="left" rel="popover" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
-
        </div>
+
</div>
-
        <div class="col-md-5">
+
<div class="col-md-3">
-
          <img class="featurette-image img-responsive" src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/check-in-minion.jpg" width="250px">
+
            <a href="javascript:;"id="3" rel="popover" data-placement="top" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
-
        </div>
+
</div>
 +
<div class="col-md-3">
 +
            <a href="javascript:;"id="4" rel="popover" data-placement="bottom" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
 +
</div>
 +
<div class="col-md-3">  
 +
            <a href="javascript:;"id="5" rel="popover" data-placement="left" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
       </div>
       </div>
-
 
+
<div class="col-md-3">  
-
      <hr class="featurette-divider">
+
            <a href="javascript:;"id="6" rel="popover" data-placement="top" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
-
 
+
-
      <div class="row featurette">
+
-
        <div class="col-md-5">
+
-
          <img class="featurette-image img-responsive" src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/foto-minion-stuart-en-gru-2%2C-mi-villano-favorito-795.jpg" width="250px">
+
-
        </div>
+
-
        <div class="col-md-7">
+
-
          <h2 class="featurette-heading">Segundo minion<span class="text-muted">See for yourself.</span></h2>
+
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
-
        </div>
+
       </div>
       </div>
-
 
+
<div class="col-md-3">  
-
      <hr class="featurette-divider">
+
            <a href="javascript:;"id="7" rel="popover" data-placement="bottom" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
-
 
+
-
      <div class="row featurette">
+
-
        <div class="col-md-7">
+
-
          <h2 class="featurette-heading">Tercer minion<span class="text-muted">Checkmate.</span></h2>
+
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
-
        </div>
+
-
        <div class="col-md-5">
+
-
          <img class="featurette-image img-responsive" src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/foto-minion-dave-en-gru-2%2C-mi-villano-favorito-807.jpg" width="250px">
+
-
        </div>
+
       </div>
       </div>
-
 
+
<div class="col-md-3">  
-
      <hr class="featurette-divider">
+
            <a href="javascript:;"id="8" rel="popover" data-placement="left" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
-
 
+
-
      <!-- /END THE FEATURETTES -->
+
-
 
+
-
<h3><span class="text-muted">Meet the students</span></h3>
+
-
      <!-- START THE FEATURETTES -->
+
-
 
+
-
      <hr class="featurette-divider">
+
-
 
+
-
      <div class="row featurette">
+
-
        <div class="col-md-7">
+
-
          <h2 class="featurette-heading">Miguel Loera Sánchez. <span class="text-muted">He'll blow your mind.</span></h2>
+
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
-
        </div>
+
-
        <div class="col-md-5">
+
-
          <img class="featurette-image img-responsive" src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/check-in-minion.jpg" width="250px">
+
-
        </div>
+
       </div>
       </div>
 +
</div>
 +
<!-- Instructors-->
 +
<h3><span class="text-muted">Meet the Instructors</span></h3><hr>
 +
<div class="col-md-3">
 +
            <a href="javascript:;"id="18" rel="popover" data-placement="left" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
 +
</div>
 +
<div class="col-md-3">
 +
            <a href="javascript:;"id="19" rel="popover" data-placement="bottom" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
 +
</div>
 +
<div class="col-md-3">
 +
            <a href="javascript:;"id="20" rel="popover" data-placement="left" data-content="He'll blow your mind. " data-original-title="Miguel Loera Sánchez"><img src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/m2.jpg" width="200px" heigth="200px"></a>
-
       <hr class="featurette-divider">
+
       </div></div>
-
 
+
  </body>
-
      <div class="row featurette">
+
<script>
-
        <div class="col-md-5">
+
       $(function (){
-
          <img class="featurette-image img-responsive" src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/foto-minion-stuart-en-gru-2%2C-mi-villano-favorito-795.jpg" width="250px">
+
        $("#1, #2,#3,#4,#5,#6,#7,#8,#9,#10,#11,#12,#13,#14,#15,#16,#17,#18,#19,#20").popover();
-
        </div>
+
       });
-
        <div class="col-md-7">
+
   
-
          <h2 class="featurette-heading">Segundo minion<span class="text-muted">See for yourself.</span></h2>
+
       </script>    
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
 
-
        </div>
+
-
      </div>
+
-
 
+
-
      <hr class="featurette-divider">
+
-
 
+
-
       <div class="row featurette">
+
-
        <div class="col-md-7">
+
-
          <h2 class="featurette-heading">Tercer minion<span class="text-muted">Checkmate.</span></h2>
+
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
-
        </div>
+
-
        <div class="col-md-5">
+
-
          <img class="featurette-image img-responsive" src="https://dl.dropboxusercontent.com/u/82007410/igem%202013/foto-minion-dave-en-gru-2%2C-mi-villano-favorito-807.jpg" width="250px">
+
-
        </div>
+
-
      </div>
+
-
 
+
-
      <hr class="featurette-divider">
+
-
 
+
-
      <!-- /END THE FEATURETTES -->
+
-
     
+
-
<h3><span class="text-muted">Meet the instructors</span></h3>
+
-
      <!-- START THE FEATURETTES -->
+
-
 
+
-
      <hr class="featurette-divider">
+
-
 
+
-
      <div class="row featurette">
+
-
        <div class="col-md-7">
+
-
          <h2 class="featurette-heading">Claudio Moreno Rocha. <span class="text-muted">It'll blow your mind.</span></h2>
+
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
-
        </div>
+
-
        <div class="col-md-5">
+
-
          <img class="featurette-image img-responsive" src="data:image/png;base64," data-src="holder.js/250x250/auto" alt="Generic placeholder image">
+
-
        </div>
+
-
      </div>
+
-
 
+
-
      <hr class="featurette-divider">
+
-
 
+
-
      <div class="row featurette">
+
-
        <div class="col-md-5">
+
-
          <img class="featurette-image img-responsive" src="data:image/png;base64," data-src="holder.js/250x250/auto" alt="Generic placeholder image">
+
-
        </div>
+
-
        <div class="col-md-7">
+
-
          <h2 class="featurette-heading">Antonio Guzmán<span class="text-muted">See for yourself.</span></h2>
+
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
-
        </div>
+
-
      </div>
+
-
 
+
-
      <hr class="featurette-divider">
+
-
 
+
-
      <div class="row featurette">
+
-
        <div class="col-md-7">
+
-
          <h2 class="featurette-heading">Diana Reséndez<span class="text-muted">Checkmate.</span></h2>
+
-
          <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+
-
        </div>
+
-
        <div class="col-md-5">
+
-
          <img class="featurette-image img-responsive" src="data:image/png;base64," data-src="holder.js/250x250/auto" alt="Generic placeholder image">
+
-
        </div>
+
-
       </div>
+
-
 
+
-
       <hr class="featurette-divider">
+
-
 
+
-
      <!-- /END THE FEATURETTES -->
+
</html>
</html>
-
 
{{:Team:UANL_Mty-Mexico/Templates:Footer}}
{{:Team:UANL_Mty-Mexico/Templates:Footer}}

Revision as of 19:46, 7 September 2013

Carousel Template for Bootstrap


Meet the students


Meet the Instructors


Creative Commons License