Team:BIOTEC Dresden/sandbox2

From 2010.igem.org

(Difference between revisions)
(New page: {{Biotec_Dresden/Header}} <html> <head> <script type="text/JavaScript" src="http://endo.bio.tu-dresden.de/igem/scripthost/slimbox/js/slimbox2.js"></script> <link media="screen" type="text...)
(Undo revision 28454 by Lucas.schirmer (Talk))
 
(13 intermediate revisions not shown)
Line 1: Line 1:
-
{{Biotec_Dresden/Header}}
 
-
 
<html>
<html>
<head>
<head>
 +
 +
<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/slimbox/js/slimbox2.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">
<link media="screen" type="text/css" href="http://endo.bio.tu-dresden.de/igem/scripthost/slimbox/css/slimbox2.css" rel="stylesheet">
 +
<link media="screen" type="text/css" href="http://endo.bio.tu-dresden.de/igem/scripthost/navigation/menu.css" rel="stylesheet">
 +
 +
<script type="text/javascript" src="http://platform.twitter.com/anywhere.js?id=Dj7wtyqEEY47tJHRHddQ&v=1"></script>
 +
<script type="text/javascript" src="http://endo.bio.tu-dresden.de/igem/scripthost/jtwett/jtweetsanywhere.min.js"></script>
 +
<link rel="stylesheet" type="text/css" href="http://endo.bio.tu-dresden.de/igem/scripthost/jtwett/jtweetsanywhere.css" />
 +
 +
<script src="http://endo.bio.tu-dresden.de/igem/scripthost/countdown/kk_countdown.min.js" type="text/javascript"></script>
 +
<link rel="stylesheet" type="text/css" href="http://endo.bio.tu-dresden.de/igem/scripthost/countdown/rrclock.css" />
 +
 +
 +
<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")
 +
}
 +
);
 +
});
 +
 +
$(document).ready(function(){
 +
    $('#tweetsFeed').jTweetsAnywhere({
 +
        username: 'igem_biotec',
 +
        count: 10,
 +
        showFollowButton: true
 +
 +
    });
 +
});
 +
</script>
 +
</head>
</head>
-
<body>
+
    <body>
-
<a href="https://static.igem.org/mediawiki/2010/2/24/Under_construction.jpg" rel="lightbox" title="Image of Svea Grieb">
+
    <!-- This is the container for the carousel. -->
-
<img src="https://static.igem.org/mediawiki/2010/2/24/Under_construction.jpg" class="team_pic">
+
        <div id = "carousel1" style="width:800px; height:500px;background:#000;overflow:scroll;">                     
-
</a></body>
+
<!-- Define left and right buttons. -->
-
</html>
+
        <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 Victor" title="Image of Victor" /></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>
 +
<a href="http://apycom.com/menus/1-dim-gray.html">more ideas</a>
 +
<div id="menu">
 +
    <ul class="menu">
 +
        <li><a href="#" class="parent"><span>Home</span></a>
 +
            <div><ul>
 +
                <li><a href="#" class="parent"><span>Sub Item 1</span></a>
 +
                    <div><ul>
 +
                        <li><a href="#" class="parent"><span>Sub Item 1.1</span></a>
 +
                            <div><ul>
 +
                                <li><a href="#"><span>Sub Item 1.1.1</span></a></li>
 +
                                <li><a href="#"><span>Sub Item 1.1.2</span></a></li>
 +
                            </ul></div>
 +
                        </li>
 +
                        <li><a href="#"><span>Sub Item 1.2</span></a></li>
 +
                        <li><a href="#"><span>Sub Item 1.3</span></a></li>
 +
                        <li><a href="#"><span>Sub Item 1.4</span></a></li>
 +
                        <li><a href="#"><span>Sub Item 1.5</span></a></li>
 +
                        <li><a href="#"><span>Sub Item 1.6</span></a></li>
 +
                        <li><a href="#" class="parent"><span>Sub Item 1.7</span></a>
 +
                            <div><ul>
 +
                                <li><a href="#"><span>Sub Item 1.7.1</span></a></li>
 +
                                <li><a href="#"><span>Sub Item 1.7.2</span></a></li>
 +
                            </ul></div>
 +
                        </li>
 +
                    </ul></div>
 +
                </li>
 +
                <li><a href="#"><span>Sub Item 2</span></a></li>
 +
                <li><a href="#"><span>Sub Item 3</span></a></li>
 +
            </ul></div>
 +
        </li>
 +
        <li><a href="#"><span>Product Info</span></a>
 +
            <div><ul>
 +
                <li><a href="#" class="parent"><span>Sub Item 1</span></a>
 +
                    <div><ul>
 +
                        <li><a href="#"><span>Sub Item 1.1</span></a></li>
 +
                        <li><a href="#"><span>Sub Item 1.2</span></a></li>
 +
                    </ul></div>
 +
                </li>
 +
                <li><a href="#" class="parent"><span>Sub Item 2</span></a>
 +
                    <div><ul>
 +
                        <li><a href="#"><span>Sub Item 2.1</span></a></li>
 +
                        <li><a href="#"><span>Sub Item 2.2</span></a></li>
 +
                    </ul></div>
 +
                </li>
 +
                <li><a href="#"><span>Sub Item 3</span></a></li>
 +
                <li><a href="#"><span>Sub Item 4</span></a></li>
 +
                <li><a href="#"><span>Sub Item 5</span></a></li>
 +
                <li><a href="#"><span>Sub Item 6</span></a></li>
 +
                <li><a href="#"><span>Sub Item 7</span></a></li>
 +
            </ul></div>
 +
        </li>
 +
        <li><a href="#"><span>Help</span></a></li>
 +
        <li class="last"><a href="#"><span>Contacts</span></a></li>
 +
    </ul>
 +
</div>
-
{{Biotec_Dresden/Bottom}}
+
<h2>our twitter box</h2>
 +
<div id="tweetsFeed"></div>
 +
 
 +
<h2>AddThis</h2>
 +
<!-- AddThis Button BEGIN -->
 +
<div class="addthis_toolbox addthis_default_style">
 +
<a class="addthis_button_favorites"></a>
 +
<a class="addthis_button_email"></a>
 +
<a class="addthis_button_print"></a>
 +
<span class="addthis_separator">|</span>
 +
<a class="addthis_button_facebook"></a>
 +
<a class="addthis_button_twitter"></a>
 +
<a class="addthis_button_stumbleupon"></a>
 +
<span class="addthis_separator"> </span>
 +
<a class="addthis_button_facebook_like"></a>
 +
 
 +
<a href="http://www.addthis.com/bookmark.php?v=250&amp;username=igembiotec" class="addthis_button_expanded">More</a>
 +
</div>
 +
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=igembiotec"></script>
 +
<!-- AddThis Button END -->
 +
<h2>count down - without flash ^^</h2>
 +
        <script type="text/javascript">
 +
            $(document).ready(function(){
 +
                $("body").kkCountDown();
 +
            });
 +
        </script>
 +
 
 +
        <div id="content">
 +
            <div id="count-box">
 +
                <span time="1288915200" class="kkcount-down"></span>
 +
            </div>
 +
        </div>
 +
 
 +
  okay a few coverflow ideas
 +
 
 +
http://folio.vndv.com/jcoverflow/
 +
http://www.classycode.co.uk/CoverFlow/rwmCoverFlow%20-%20demo.htm
 +
http://finnrudolph.de/ImageFlow/Examples#Default
 +
 
 +
 
 +
    </body>
 +
 
 +
</html>

Latest revision as of 20:07, 20 July 2010

Image of Adi Image of Svea Image of Sarah Image of Mareike Image of Habib Image of Jon Image of Charanya Image of Rahul Image of Victor Image of Lucas

Menu Idea

more ideas

our twitter box

AddThis

| More

count down - without flash ^^

okay a few coverflow ideas http://folio.vndv.com/jcoverflow/ http://www.classycode.co.uk/CoverFlow/rwmCoverFlow%20-%20demo.htm http://finnrudolph.de/ImageFlow/Examples#Default