|
|
Line 20: |
Line 20: |
| </map> | | </map> |
| | | |
- | <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 (navigator.userAgent.match(/msie/i))
| |
- | {
| |
- | if ($("#bxsliderText").parent().css("height") != $("#bxslider").parent().css("height"))
| |
- | setTimeout(function() {$( "#bxsliderText" ).parent().css({"height": $("#bxslider").parent().css("height")});}, 100);
| |
- | }
| |
- |
| |
- | if (!initial)
| |
- | {
| |
- | var container = $('#bxslider > li');
| |
- | var imgWidth = container.width();
| |
- |
| |
- | $( "#map4" ).each(function() {
| |
- | $(this).css('height', 'auto', 'width', 'auto');
| |
- | $(this).mapster('resize',Math.min(imgWidth, $(this).naturalWidth()) ,0,0);
| |
- | });
| |
- | }
| |
- |
| |
- | }
| |
- |
| |
- | $(document).ready(function(){
| |
- | sliderText = $('#bxsliderText').bxSlider({'mode': 'fade', 'controls': false, 'pager': false, 'auto': false, "responsive": false, 'touch': false});
| |
- | slider = $('#bxslider').bxSlider({ 'auto': false, onSlideAfter: function(slideElement, oldIndex, newIndex){sliderText.goToSlide(newIndex);}, onSlideBefore: function(slideElement, oldIndex, newIndex){sliderText.goToSlide(newIndex);}});
| |
- | $('#bxsliderText').parent().css({"height": "100%", 'min-height' : '430px'});
| |
- | $('#bxsliderText').parent().parent().css({"height": "100%"});
| |
- | $('.bx-viewport #bxslider').bind('mousewheel', function(event, delta, deltaX, deltaY) {
| |
- | event.preventDefault();
| |
- | if (delta < 0) {slider.goToNextSlide();}
| |
- | else {slider.goToPrevSlide();}
| |
- | });
| |
- | $('#map4').mapster({
| |
- | fillColor: 'c2d8f1',
| |
- | fillOpacity: 0.9, /*
| |
- | stroke: true,
| |
- | strokeColor: 'c2d8f1',
| |
- | strokeOpacity: 0.9,
| |
- | strokeWidth: 2, */
| |
- | clickNavigate: true
| |
- | });
| |
- |
| |
- |
| |
- | $(window).resize(
| |
- | function()
| |
- | {
| |
- | onWindowResize();
| |
- | });
| |
- | resize(true);
| |
- | });
| |
- | </script>
| |
| | | |
| </article></html> | | </article></html> |
| | | |
| {{:Team:ETH Zurich/tpl/foot}} | | {{:Team:ETH Zurich/tpl/foot}} |