Team:Heidelberg/Templates/Footer-Tour

From 2013.igem.org

(Difference between revisions)
 
(12 intermediate revisions not shown)
Line 14: Line 14:
.imageMap a.p4 {height: 46%;left: 30.4%;top: 20%;transform: rotate(18deg);-ms-transform:rotate(18deg); /* IE 9 */
.imageMap a.p4 {height: 46%;left: 30.4%;top: 20%;transform: rotate(18deg);-ms-transform:rotate(18deg); /* IE 9 */
-webkit-transform:rotate(18deg); /* Safari and Chrome */width: 6.3%;}
-webkit-transform:rotate(18deg); /* Safari and Chrome */width: 6.3%;}
-
.imageMap a.p5 {height: 28%;left: 36.7%;top: 39.5%;transform: rotate(-8deg);-ms-transform:rotate(-8deg); /* IE 9 */
+
.imageMap a.p5 {height: 28%;left: 36.2%;top: 39.5%;transform: rotate(-8deg);-ms-transform:rotate(-8deg); /* IE 9 */
-webkit-transform:rotate(-8deg); /* Safari and Chrome */width: 4.3%;}
-webkit-transform:rotate(-8deg); /* Safari and Chrome */width: 4.3%;}
-
.imageMap a.p6 {height: 38%;left: 42.5%;top: 27%;transform: rotate(23deg);-ms-transform:rotate(23deg); /* IE 9 */
+
.imageMap a.p6 {height: 38%;left: 42%;top: 27%;transform: rotate(23deg);-ms-transform:rotate(23deg); /* IE 9 */
-webkit-transform:rotate(23deg); /* Safari and Chrome */width: 5.6%;}
-webkit-transform:rotate(23deg); /* Safari and Chrome */width: 5.6%;}
-
.imageMap a.p7 {height: 46%;left: 49.2%;top: 20%;transform: rotate(-27deg);-ms-transform:rotate(-27deg); /* IE 9 */
+
.imageMap a.p7 {height: 46%;left: 48.8%;top: 20%;transform: rotate(-27deg);-ms-transform:rotate(-27deg); /* IE 9 */
-webkit-transform:rotate(-27deg); /* Safari and Chrome */width: 6.3%;}
-webkit-transform:rotate(-27deg); /* Safari and Chrome */width: 6.3%;}
-
.imageMap a.p8 {height: 57%;left: 56.8%;top: 8%;transform: rotate(23.5deg);-ms-transform:rotate(23.5deg); /* IE 9 */
+
.imageMap a.p8 {height: 57%;left: 56.3%;top: 8%;transform: rotate(23.5deg);-ms-transform:rotate(23.5deg); /* IE 9 */
-webkit-transform:rotate(23.5deg); /* Safari and Chrome */width: 8%;}
-webkit-transform:rotate(23.5deg); /* Safari and Chrome */width: 8%;}
-
.imageMap a.p9 {height: 28%;left: 64.7%;top: 37%;transform: rotate(-45deg);-ms-transform:rotate(-45deg); /* IE 9 */
+
.imageMap a.p9 {height: 28%;left: 64.2%;top: 37%;transform: rotate(-45deg);-ms-transform:rotate(-45deg); /* IE 9 */
-webkit-transform:rotate(-45deg); /* Safari and Chrome */width: 4%;}
-webkit-transform:rotate(-45deg); /* Safari and Chrome */width: 4%;}
-
.imageMap a.p10 {height: 28.5%;left: 69.2%;top: 38%;transform: rotate(22deg);-ms-transform:rotate(22deg); /* IE 9 */
+
.imageMap a.p10 {height: 28.5%;left: 68.8%;top: 38%;transform: rotate(22deg);-ms-transform:rotate(22deg); /* IE 9 */
-webkit-transform:rotate(22deg); /* Safari and Chrome */width: 4.1%;}
-webkit-transform:rotate(22deg); /* Safari and Chrome */width: 4.1%;}
-
.imageMap a.p11 {height: 46%;left: 73.5%;top: 20%;transform: rotate(-18deg);-ms-transform:rotate(-18deg); /* IE 9 */
+
.imageMap a.p11 {height: 46%;left: 73%;top: 20%;transform: rotate(-18deg);-ms-transform:rotate(-18deg); /* IE 9 */
-webkit-transform:rotate(-18deg); /* Safari and Chrome */width: 6.3%;}
-webkit-transform:rotate(-18deg); /* Safari and Chrome */width: 6.3%;}
-
.imageMap a.p12{height: 41%;left: 82.2%;top: 25%;transform: rotate(24.5deg);-ms-transform:rotate(24.5deg); /* IE 9 */
+
.imageMap a.p12{height: 41%;left: 81.7%;top: 25%;transform: rotate(24.5deg);-ms-transform:rotate(24.5deg); /* IE 9 */
-webkit-transform:rotate(24.5deg); /* Safari and Chrome */width: 5.6%;}
-webkit-transform:rotate(24.5deg); /* Safari and Chrome */width: 5.6%;}
-
.imageMap a.p13{height: 29%;left: 88.2%;top: 36.5%;transform: rotate(40deg);-ms-transform:rotate(40deg); /* IE 9 */
+
.imageMap a.p13{height: 29%;left: 87.8%;top: 36.5%;transform: rotate(40deg);-ms-transform:rotate(40deg); /* IE 9 */
-webkit-transform:rotate(40deg); /* Safari and Chrome */width: 4%;}
-webkit-transform:rotate(40deg); /* Safari and Chrome */width: 4%;}
-
.imageMap a.p14{height: 29%;left: 92.9%;top: 38%;transform: rotate(-16deg);-ms-transform:rotate(-16deg); /* IE 9 */
+
.imageMap a.p14{height: 29%;left: 92.4%;top: 38%;transform: rotate(-16deg);-ms-transform:rotate(-16deg); /* IE 9 */
-webkit-transform:rotate(-16deg); /* Safari and Chrome */width: 4%;}
-webkit-transform:rotate(-16deg); /* Safari and Chrome */width: 4%;}
-
.imageMap a + p {position:absolute; left:0%; top:102%; width:100%; color:#000; display:none;}
+
                .imageMap a.p15 {height: 28%;left: 21.3%;top: 11.7%;transform: rotate(26deg);;-ms-transform:rotate(26deg); /* IE 9 */
 +
-webkit-transform:rotate(26deg); /* Safari and Chrome */width: 4.3%;}
 +
                .imageMap a.p16 {height: 28%;left: 66.5%;top: 10.5%;transform: rotate(-10deg);;-ms-transform:rotate(-10deg); /* IE 9 */
 +
-webkit-transform:rotate(-10deg); /* Safari and Chrome */width: 4.3%;}
.imageMap:hover .hotspots {visibility:visible;}
.imageMap:hover .hotspots {visibility:visible;}
Line 55: Line 58:
.imageMap .hotspots div:hover b {width:0; padding:0;}
.imageMap .hotspots div:hover b {width:0; padding:0;}
.imageMap .hotspots div:hover p {display:block;}
.imageMap .hotspots div:hover p {display:block;}
-
.imageMap .hotspots div:hover a {background:#fff; z-index:100; opacity:0.3; filter: alpha(opacity=30); border:1px solid #000;}
+
.imageMap .hotspots div:hover a {background:#fff; z-index:100; opacity:0.3; filter: alpha(opacity=30);}
</style>
</style>
<div class="row">
<div class="row">
Line 61: Line 64:
<div class="imageMap" aria-haspopup="true">
<div class="imageMap" aria-haspopup="true">
  <img src="https://static.igem.org/mediawiki/2013/f/fd/Heidelberg_bottom_sponsors2.png" width="100%">
  <img src="https://static.igem.org/mediawiki/2013/f/fd/Heidelberg_bottom_sponsors2.png" width="100%">
 +
<center>Thanks to <object style="width:20px; top:0px" data="https://static.igem.org/mediawiki/2013/0/07/Heidelberg_boot.png"></object></center>
<div class="hotspots">
<div class="hotspots">
<div title="Roth">
<div title="Roth">
Line 129: Line 133:
<div title="Sigma Aldrich">
<div title="Sigma Aldrich">
<a class="p14" aria-haspopup="false" rel="nofollow" href="http://sigmaaldrich.com"></a>
<a class="p14" aria-haspopup="false" rel="nofollow" href="http://sigmaaldrich.com"></a>
 +
</div>
 +
</div>
 +
                        <div class="hotspots">
 +
<div title="Era SynBio">
 +
<a class="p15" aria-haspopup="false" rel="nofollow" href="http://www.erasynbio.eu/"></a>
 +
</div>
 +
</div>
 +
                        <div class="hotspots">
 +
<div title="Golschmied Haas">
 +
<a class="p16" aria-haspopup="false" rel="nofollow" href=""></a>
</div>
</div>
</div>
</div>
Line 136: Line 150:
<div>
<div>
<script src="https://2013.igem.org/Team:Heidelberg/Templates/jquery-js?action=raw&ctype=text/javascript"></script>
<script src="https://2013.igem.org/Team:Heidelberg/Templates/jquery-js?action=raw&ctype=text/javascript"></script>
-
<!--<script src="https://2013.igem.org/Team:Heidelberg/Templates/bootstrapjs?action=raw&ctype=text/javascript"></script>
+
<script src="https://2013.igem.org/Team:Heidelberg/Templates/bootstrapjs?action=raw&ctype=text/javascript"></script>
-
<script src="https://2013.igem.org/Team:Heidelberg/Templates/holderjs?action=raw&ctype=text/javascript"></script>-->
+
<script src="https://2013.igem.org/Team:Heidelberg/Templates/holderjs?action=raw&ctype=text/javascript"></script>
<script src="https://2013.igem.org/Team:Heidelberg/Templates/easing-js?action=raw&ctype=text/javascript"></script>
<script src="https://2013.igem.org/Team:Heidelberg/Templates/easing-js?action=raw&ctype=text/javascript"></script>
<script src="https://2013.igem.org/Team:Heidelberg/Templates/kwicks.js?action=raw&ctype=text/javascript"></script>
<script src="https://2013.igem.org/Team:Heidelberg/Templates/kwicks.js?action=raw&ctype=text/javascript"></script>
Line 143: Line 157:
<script type="text/javascript">
<script type="text/javascript">
$(function() {
$(function() {
-
                                 $('.text').hide();
+
                                 $('.carousel').carousel();
 +
                                $('.jumbotron').hide();
 +
                                $('#overview').show();
                                 $('#panel-1').click(function(){
                                 $('#panel-1').click(function(){
 +
                                        $('.jumbotron').hide();
                                         $('#overview').show();
                                         $('#overview').show();
 +
                                });
 +
                                $('#panel-2').click(function(){
 +
                                        $('.jumbotron').hide();
 +
                                        $('#gold').show();
 +
                                });
 +
                                $('#panel-3').click(function(){
 +
                                        $('.jumbotron').hide();
 +
                                        $('#modules').show();
 +
                                });
 +
                                $('#panel-4').click(function(){
 +
                                        $('.jumbotron').hide();
 +
                                        $('#tag').show();
 +
                                });
 +
                                $('#panel-5').click(function(){
 +
                                        $('.jumbotron').hide();
 +
                                        $('#soft').show();
 +
                                });
 +
                                $('#panel-6').click(function(){
 +
                                        $('.jumbotron').hide();
 +
                                        $('#model').show();
 +
                                });
 +
                                $('#panel-7').click(function(){
 +
                                        $('.jumbotron').hide();
 +
                                        $('#hp').show();
 +
                                });
 +
                                $('#panel-8').click(function(){
 +
                                        $('.jumbotron').hide();
 +
                                        $('#results').show();
                                 });
                                 });
                                 $('.kwicks').kwicks({
                                 $('.kwicks').kwicks({
-
                                         maxSize : 250,
+
                                         maxSize : "250px",
                                         spacing : 5,
                                         spacing : 5,
                                         behavior: 'menu'
                                         behavior: 'menu'
Line 166: Line 211:
         var $this = $(this);
         var $this = $(this);
         $this.find('img.circle').stop().animate({
         $this.find('img.circle').stop().animate({
-
             'width'    :'300px',
+
             'width'    :'320px',
-
             'height'    :'300px',
+
             'height'    :'320px',
//                      'top'      :'0 px',
//                      'top'      :'0 px',
                 'left'      :'-124px',
                 'left'      :'-124px',

Latest revision as of 20:37, 28 October 2013

Thanks to