Template:Team:Calgary/Main

From 2013.igem.org

(Difference between revisions)
Line 33: Line 33:
<!-- JavaScript & JQuery -->
<!-- JavaScript & JQuery -->
<script src="http://code.jquery.com/jquery-2.0.3.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/jquery-2.0.3.min.js" type="text/javascript"></script>
 +
<script>
 +
$(document).ready(function() {
 +
if ($('body').width() > 868) {
 +
$('#TopBar').css('padding-left', Math.floor(($('body').width() - 868) / 2));
 +
$('#LogoItem').css('display', 'block');
 +
}
 +
else if ($('body').width() <= 868) {
 +
if ($('body').width() > 744) {
 +
$('#TopBar').css('padding-left', Math.floor(($('body').width() - 744) / 2));
 +
$('#LogoItem').css('display', 'none');
 +
}
 +
}
 +
var ScreenWidth = $('body').width();
 +
if (ScreenWidth > 1007) {
 +
var Margins = Math.floor(ScreenWidth * .086666);
 +
var ElementWidth = Math.floor(ScreenWidth * .37);
 +
 +
$('#SectionLinks').css('padding-left', Margins);
 +
$('#SectionLinks').css('padding-top', Margins);
 +
$('#SectionLinks .DescriptionLink').css('margin-right', Margins);
 +
$('#SectionLinks .DescriptionLink').css('margin-bottom', Margins);
 +
$('#SectionLinks .DescriptionLink').css('width', ElementWidth);
 +
}
 +
 +
$(window).resize(function() {
 +
if ($('body').width() > 868) {
 +
$('#TopBar').css('padding-left', Math.floor(($('body').width() - 868) / 2));
 +
$('#LogoItem').css('display', 'block');
 +
}
 +
else if ($('body').width() <= 868) {
 +
if ($('body').width() > 744) {
 +
$('#TopBar').css('padding-left', Math.floor(($('body').width() - 744) / 2));
 +
$('#LogoItem').css('display', 'none');
 +
}
 +
}
 +
 +
var ScreenWidth = $('body').width();
 +
if (ScreenWidth > 1007) {
 +
var Margins = Math.floor(ScreenWidth * .086666);
 +
var ElementWidth = Math.floor(ScreenWidth * .37);
 +
 +
$('#SectionLinks').css('padding-left', Margins);
 +
$('#SectionLinks').css('padding-top', Margins);
 +
$('#SectionLinks .DescriptionLink').css('margin-right', Margins);
 +
$('#SectionLinks .DescriptionLink').css('margin-bottom', Margins);
 +
$('#SectionLinks .DescriptionLink').css('width', ElementWidth);
 +
}
 +
 +
});
 +
});
 +
</script>
 +
<script>
 +
$(document).ready(function() {
 +
//Set height of slider (12/7 ratio)
 +
$('#Slider').css('height', ($('body').width() / 2.4));
 +
 +
//Position right/left arrows
 +
var BarHeight = $('#Slider').height() -  $('#BottomLinks').height();
 +
$('#LeftBar, #RightBar').css('height', BarHeight);
 +
$('#LeftArrow, #RightArrow').css('top', (BarHeight-60)/2);
 +
 +
//Repeats for window resize
 +
$(window).resize(function() {
 +
$('#Slider').css('height', ($('body').width() / 2.4));
 +
 +
var BarHeight = $('#Slider').height() -  $('#BottomLinks').height();
 +
$('#LeftBar, #RightBar').css('height', BarHeight);
 +
$('#LeftArrow, #RightArrow').css('top', (BarHeight-60)/2);
 +
});
 +
 +
// var preloadImages = ['TestSlide0.jpg','TestSlide1.jpg','TestSlide2.jpg','TestSlide3.jpg','TestSlide4.jpg'];
 +
// var images = [];
 +
// for (var count = 0; count < preloadImages.length; count++) {
 +
// images[count] = new Image();
 +
// images[count].src = preloadImages[count];
 +
// }
 +
 +
var TotalSlides = $('.Slides').length
 +
var CurrentSlide = 0;
 +
 +
$('#RightArrow').click(function() {
 +
CurrentSlide = ++CurrentSlide % TotalSlides;
 +
$('.Slides').css('display', 'none');
 +
SlideID = '#Slide' + CurrentSlide;
 +
$(SlideID).css('display', 'block');
 +
 +
});
 +
 +
$('#LeftArrow').click(function() {
 +
CurrentSlide = (CurrentSlide + TotalSlides - 1) % TotalSlides;
 +
$('.Slides').css('display', 'none');
 +
SlideID = '#Slide' + CurrentSlide;
 +
$(SlideID).css('display', 'block');
 +
 +
});
 +
 +
$('.SlideLink').click(function() {
 +
var ClickedSlide = $(this).attr('id');
 +
CurrentSlide = parseInt(ClickedSlide.replace('Link', ''));
 +
$('.Slides').css('display', 'none');
 +
SlideID = '#Slide' + CurrentSlide;
 +
$(SlideID).css('display', 'block');
 +
 +
});
 +
});
 +
</script>
</head>
</head>

Revision as of 22:17, 16 August 2013