|
|
Line 3: |
Line 3: |
| | | |
| <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/jquery.min.js"></script> | | <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/jquery.min.js"></script> |
- | <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/cloud-carousel.js"></script>
| |
- | <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/slimbox/js/slimbox2.js"></script>
| |
| <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/navigation/menu.css"></script> | | <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/navigation/menu.css"></script> |
| <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/navigation/menu.js"></script> | | <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/navigation/menu.js"></script> |
- | <link media="screen" type="text/css" href="http://endo.bio.tu-dresden.de/igem/scripthost/slimbox/css/slimbox2.css" rel="stylesheet">
| |
| | | |
- | <script type="text/JavaScript">
| |
- | $(document).ready(function(){
| |
- |
| |
- | // This initialises carousels on the container elements specified, in this case, carousel1.
| |
- | $("#carousel1").CloudCarousel(
| |
- | {
| |
- | xPos: 400,
| |
- | xRadius:300,
| |
- | yPos: 120,
| |
- | buttonLeft: $("#left-but"),
| |
- | buttonRight: $("#right-but"),
| |
- | altBox: $("#alt-text"),
| |
- | titleBox: $("#title-text")
| |
- | }
| |
- | );
| |
- | });
| |
- |
| |
- | </script>
| |
- |
| |
| </head> | | </head> |
| <body> | | <body> |
- | <!-- This is the container for the carousel. -->
| |
- | <div id = "carousel1" style="width:800px; height:500px;background:#000;overflow:scroll;">
| |
- | <!-- Define left and right buttons. -->
| |
- | <input id="left-but" type="button" value="Left" />
| |
- | <input id="right-but" type="button" value="Right" />
| |
- |
| |
- | <!-- All images with class of "cloudcarousel" will be turned into carousel items -->
| |
- | <!-- You can place links around these images -->
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/8/8e/BiotecDresden_Circle_Adi.jpg" rel="lightbox" title="Image of Adi"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/8/8e/BiotecDresden_Circle_Adi.jpg/300px-BiotecDresden_Circle_Adi.jpg" alt="Image of Adi" title="Image of Adi" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/b/bf/BiotecDresden_Circle_Svea.jpg" rel="lightbox" title="Image of Svea"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/b/bf/BiotecDresden_Circle_Svea.jpg/300px-BiotecDresden_Circle_Svea.jpg" alt="Image of Svea" title="Image of Svea" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/5/54/BiotecDresden_Circle_Sarah.jpg" rel="lightbox" title="Image ofSarah"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/5/54/BiotecDresden_Circle_Sarah.jpg/300px-BiotecDresden_Circle_Sarah.jpg" alt="Image of Sarah" title="Image of Sarah" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/a/a4/BiotecDresden_Circle_Mareike.jpg" rel="lightbox" title="Image of Mareike"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/a/a4/BiotecDresden_Circle_Mareike.jpg/300px-BiotecDresden_Circle_Mareike.jpg" alt="Image of Mareike" title="Image of Mareike" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/f/f0/BiotecDresden_Circle_Habib.jpg" rel="lightbox" title="Image of Habib"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/f/f0/BiotecDresden_Circle_Habib.jpg/300px-BiotecDresden_Circle_Habib.jpg" alt="Image of Habib" title="Image of Habib" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/0/07/BiotecDresden_Circle_Jon.jpg" rel="lightbox" title="Image of Jon"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/0/07/BiotecDresden_Circle_Jon.jpg/300px-BiotecDresden_Circle_Jon.jpg" alt="Image of Jon" title="Image of Jon" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/e/e8/BiotecDresden_Circle_Charanya.jpg" rel="lightbox" title="Image of Charanya"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/e/e8/BiotecDresden_Circle_Charanya.jpg/300px-BiotecDresden_Circle_Charanya.jpg" alt="Image of Charanya" title="Image o Charanya" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/5/51/BiotecDresden_Circle_Rahul.jpg" rel="lightbox" title="Image of Rahul"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/5/51/BiotecDresden_Circle_Rahul.jpg/300px-BiotecDresden_Circle_Rahul.jpg" alt="Image of Rahul" title="Image of Rahul" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/3/35/BiotecDresden_Circle_Viktor.jpg" rel="lightbox" title="Image of Viktor"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/3/35/BiotecDresden_Circle_Viktor.jpg/300px-BiotecDresden_Circle_Viktor.jpg" alt="Image of Viktor" title="Image of Viktor" /></a>
| |
- | <a href="https://static.igem.org/mediawiki/igem.org/2/27/BiotecDresden_Circle_Lucas.jpg" rel="lightbox" title="Image of Lucas"><img class = "cloudcarousel" src="https://static.igem.org/mediawiki/igem.org/thumb/2/27/BiotecDresden_Circle_Lucas.jpg/300px-BiotecDresden_Circle_Lucas.jpg" alt="Image of Lucas" title="Image of Lucas" /></a>
| |
- | </div>
| |
- |
| |
- |
| |
- | <!-- Define elements to accept the alt and title text from the images. -->
| |
- | <p id="title-text"></p>
| |
- | <p id="alt-text"></p>
| |
| <h2>Menu Idea</h2> | | <h2>Menu Idea</h2> |
| <a href="http://apycom.com/menus/1-dim-gray.html">more ideas</a> | | <a href="http://apycom.com/menus/1-dim-gray.html">more ideas</a> |