Team:ETH Zurich/slidermapinfo

From 2014.igem.org

(Difference between revisions)
 
(6 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
 
-
<script type="text/javascript">
 
-
(function($) {
 
-
function img(url) {
 
-
var i = new Image;
 
-
i.src = url;
 
-
return i;
 
-
}
 
-
 
-
if ('naturalWidth' in (new Image)) {
 
-
$.fn.naturalWidth = function() { return this[0].naturalWidth; };
 
-
$.fn.naturalHeight = function() { return this[0].naturalHeight; };
 
-
return;
 
-
}
 
-
$.fn.naturalWidth = function() { return img(this[0].src).width; };
 
-
$.fn.naturalHeight = function() { return img(this[0].src).height; };
 
-
})(jQuery);
 
-
 
-
 
-
 
-
function onWindowResize()
 
-
{
 
-
  var curWidth = $(window).width(),
 
-
  curHeight = $(window).height(),
 
-
  checking=false;
 
-
  if (checking) {
 
-
      return;
 
-
  }
 
-
  checking = true;
 
-
  window.setTimeout(
 
-
    function() {
 
-
        var newWidth = $(window).width(),
 
-
            newHeight = $(window).height();
 
-
        if (!(newWidth !== curWidth ||
 
-
            newHeight !== curHeight)) {
 
-
            resize(false);
 
-
        }
 
-
        checking=false;
 
-
    }, 300);
 
-
}
 
-
 
-
function resize(initial) {
 
-
if (!initial)
 
-
{
 
-
  var container =  $('#container1');
 
-
  var imgWidth = container.width();
 
-
 
-
  $( "#map1").each(function() {
 
-
      $(this).css('height', 'auto', 'width', 'auto');
 
-
      $(this).mapster('resize',Math.min(imgWidth, $(this).naturalWidth()) ,0,0); 
 
-
  });
 
-
 
-
  container = $('#container2');
 
-
  imgWidth = container.width();
 
-
 
-
  $( "#map2").each(function() {
 
-
      $(this).css('height', 'auto', 'width', 'auto');
 
-
      $(this).mapster('resize',Math.min(imgWidth, $(this).naturalWidth()) ,0,0); 
 
-
  });
 
-
}
 
-
 
-
}
 
-
 
-
$(document).ready(function(){
 
-
 
-
$('#map1').mapster({
 
-
    fillColor: 'FFFFFF',
 
-
    fillOpacity: 0.5,
 
-
    isSelectable: false,
 
-
    clickNavigate: true,
 
-
  });
 
-
 
-
 
-
 
-
$(window).resize(
 
-
  function()
 
-
  {
 
-
onWindowResize();
 
-
  });
 
-
resize(true);
 
-
 
-
});
 
-
 
-
</script>
 
-
 
<img src="https://static.igem.org/mediawiki/2014/5/54/ETH_Zurich_Slider_Slide4.png" usemap="#map1" id="map1"/>
<img src="https://static.igem.org/mediawiki/2014/5/54/ETH_Zurich_Slider_Slide4.png" usemap="#map1" id="map1"/>
-
<map id="map1" name="map1"><area shape="rect" alt="" title="" coords="532,2268,2820,2484" href="https://2014.igem.org/Team:ETH_Zurich/modeling/whole" target="" /><area shape="rect" alt="" title="" coords="212,36,3132,2268" href="https://2014.igem.org/Team:ETH_Zurich/project/infopro" target="" />
+
<map id="map1" name="map1"><area shape="rect" alt="" title="" coords="50,68,740,534" href="https://2014.igem.org/Team:ETH_Zurich/project/infopro" target="" /><area shape="rect" alt="" title="" coords="131,541,666,600" href="https://2014.igem.org/Team:ETH_Zurich/modeling/whole" target="" />
</map>
</map>
-
 
</html>
</html>

Latest revision as of 19:06, 17 October 2014