Team:Calgary/TestPage

From 2013.igem.org

(Difference between revisions)
Line 28: Line 28:
<!-- CSS Stylesheets -->
<!-- CSS Stylesheets -->
<link href="Reset.css" rel="stylesheet">
<link href="Reset.css" rel="stylesheet">
-
<link href="CarouselCSS.css" rel="stylesheet">
+
<link href="https://2013.igem.org/Team:Calgary/TestPageCSS?action=raw&ctype=text/css" rel="stylesheet">
<!-- 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 src="CarouselJS.js" type="text/javascript"></script>
+
<script>
 +
$(document).ready(function() {
 +
var preloadImages = ['Num0.png','Num1.png','Num2.png','Num3.png','Num4.png','Num5.png','Num6.png','Num7.png','Num8.png','Num9.png',];
 +
var images = [];
 +
for (var count = 0; count < preloadImages.length; count++) {
 +
images[count] = new Image();
 +
images[count].src = preloadImages[count];
 +
}
 +
 +
var TotalSlides = $('.Person').length
 +
var CurrentSlide = 0;
 +
 +
$('#RightArrow').click(function() {
 +
CurrentSlide = ++CurrentSlide % TotalSlides;
 +
$('.Person').css('display', 'none');
 +
var i = CurrentSlide;
 +
 +
for (var count = 0; count < 5; count++) {
 +
if (i >= TotalSlides)
 +
i = 0;
 +
 +
$('.Person').removeClass('Slide' + count);
 +
 +
SlideID = '#Person' + i;
 +
$(SlideID).css('display', 'block').addClass('Slide' + count);
 +
i++;
 +
}
 +
});
 +
 +
$('#LeftArrow').click(function() {
 +
CurrentSlide = (CurrentSlide + TotalSlides - 1) % TotalSlides;
 +
$('.Person').css('display', 'none');
 +
var i = CurrentSlide;
 +
 +
for (var count = 0; count < 5; count++) {
 +
if (i >= TotalSlides)
 +
i = 0;
 +
 +
$('.Person').removeClass('Slide' + count);
 +
 +
SlideID = '#Person' + i;
 +
$(SlideID).css('display', 'block').addClass('Slide' + count);
 +
i++;
 +
}
 +
});
 +
 +
$('.Person').click(function() {
 +
var ClickedPerson = $(this).attr('id');
 +
CurrentSlide = ((parseInt(ClickedPerson.replace('Person', ''))) + TotalSlides - 2) % TotalSlides;
 +
 +
$('.Person').css('display', 'none');
 +
var i = CurrentSlide;
 +
 +
for (var count = 0; count < 5; count++) {
 +
if (i >= TotalSlides)
 +
i = 0;
 +
 +
$('.Person').removeClass('Slide' + count);
 +
 +
SlideID = '#Person' + i;
 +
$(SlideID).css('display', 'block').addClass('Slide' + count);
 +
i++;
 +
}
 +
});
 +
});
 +
</script>
</head>
</head>

Revision as of 21:49, 23 August 2013

Carousel

Retrieved from "http://2013.igem.org/Team:Calgary/TestPage"