Team:Heidelberg/Templates/Footer-Nav
From 2013.igem.org
(Difference between revisions)
Nils.kurzawa (Talk | contribs) |
m |
||
(11 intermediate revisions not shown) | |||
Line 5: | Line 5: | ||
.imageMap img {display:block; width:100%; border-radius:20px;} | .imageMap img {display:block; width:100%; border-radius:20px;} | ||
.imageMap .hotspots {width:100%; height:100%; position:absolute; left:0; top:0; visibility:hidden;} | .imageMap .hotspots {width:100%; height:100%; position:absolute; left:0; top:0; visibility:hidden;} | ||
- | .imageMap a {display:block; position:absolute; z-index:100; opacity:0.2; filter: alpha(opacity=20); border:1px solid transparent; border-radius:10px;} | + | .imageMap a {display:block; position:absolute; z-index:100; opacity:0.2; filter: alpha(opacity=20); /*border:1px solid transparent; border-radius:10px;*/} |
.imageMap a.p1 {height: 28%;left: 14.3%;top: 37%;transform: rotate(40deg);-ms-transform:rotate(40deg); /* IE 9 */ | .imageMap a.p1 {height: 28%;left: 14.3%;top: 37%;transform: rotate(40deg);-ms-transform:rotate(40deg); /* IE 9 */ | ||
-webkit-transform:rotate(40deg); /* Safari and Chrome */ width: 4.3%;} | -webkit-transform:rotate(40deg); /* Safari and Chrome */ width: 4.3%;} | ||
Line 34: | Line 34: | ||
.imageMap a.p14{height: 29%;left: 92.4%;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.p15 {height: 28%;left: 21.3%;top: 11.7%;transform: rotate(26deg) | + | .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%;} | -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 a + p {position:absolute; left:0%; top:102%; width:100%; color:#000; display:none;} | .imageMap a + p {position:absolute; left:0%; top:102%; width:100%; color:#000; display:none;} | ||
Line 58: | Line 60: | ||
.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) | + | .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 64: | Line 66: | ||
<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 135: | Line 138: | ||
</div> | </div> | ||
<div class="hotspots"> | <div class="hotspots"> | ||
- | <div title=" | + | <div title="Era SynBio"> |
<a class="p15" aria-haspopup="false" rel="nofollow" href="http://www.erasynbio.eu/"></a> | <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 151: | Line 159: | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
$(function() { | $(function() { | ||
- | var items = $('.item'); | + | /*var items = $('.item'); |
for (var i = 0; i < items.length; ++i) { | for (var i = 0; i < items.length; ++i) { | ||
var dd = $(items[i]).find('ul'); | var dd = $(items[i]).find('ul'); | ||
Line 157: | Line 165: | ||
dd.css("left", ($(items[i]).innerWidth() - dd.outerWidth()) * 0.5); | dd.css("left", ($(items[i]).innerWidth() - dd.outerWidth()) * 0.5); | ||
} | } | ||
- | } | + | }*/ |
$('#nav > div').hover( | $('#nav > div').hover( | ||
function () { | function () { | ||
var $this = $(this); | var $this = $(this); | ||
+ | var offsetLeft = $this.data("offsetL") + "px"; | ||
$this.find('img.circle').stop().animate({ | $this.find('img.circle').stop().animate({ | ||
'width' :'320px', | 'width' :'320px', | ||
'height' :'320px', | 'height' :'320px', | ||
// 'top' :'0 px', | // 'top' :'0 px', | ||
- | 'left' : | + | 'left' :offsetLeft, |
'opacity' :'3.0', | 'opacity' :'3.0', | ||
},200,'easeOutBack',function(){ | },200,'easeOutBack',function(){ | ||
Line 197: | Line 206: | ||
<!-- This part is only if you want to use $...$ delimiters --> | <!-- This part is only if you want to use $...$ delimiters --> | ||
<script type="text/x-mathjax-config"> | <script type="text/x-mathjax-config"> | ||
- | MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}}); | + | MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}, TeX: {equationNumbers: { autoNumber: "AMS" }}}); |
</script> | </script> | ||
<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> | <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> | ||
</html> | </html> |
Latest revision as of 00:36, 29 October 2013