Snippet revisions — Bitbucket

+$(document).ready(function() {

+  $(".projecttext").click(function(){

+    $("#projecttext").fadeToggle(500);

+  });

+  $("#cross").click(function(){

+    $("#projecttext").fadeOut(300);

+  });

+  // 2 variabelen: een voor de totale aantal images en een voor een start positie

+  var totalImages = $('.slide').length;

+  var currentPosition = 1;

+  function controlImages(step) {

+    var images = $('.slide');

+    var visibleImage; //-> 1

+    // binnen deze loop kan je gaan tellen/ bijhouden wat je positie (counter) is

+    // je gebruikt het nu ook al om 'onzichtbaar' je counter bij te houden (welke image toon ik)

+    for(var i = 0; i < images.length; i++) {

+      if($(images[i]).hasClass('active')) {

+        $(images[i]).removeClass('active');

+        visibleImage = i + step;

+        currentPosition = currentPosition + step;

+      }

+      if (visibleImage === images.length) {

+        visibleImage = 0;

+        currentPosition = 1;

+      } else if (visibleImage < 0) {

+        visibleImage = images.length - 1;

+        currentPosition = images.length;

+      }

+    }

+    // na het bepalen van je positie kan je dit meteen wegschrijven naar je scherm.

+    $("#currentcount").text(currentPosition);

+    $(images[visibleImage]).addClass('active');

+  }

+  function nextImage() {

+    controlImages(1);

+  }

+  function prevImage() {

+    controlImages(-1)

+  }

+  $("#next").click(function(){

+    controlImages(1)

+  });

+  $("#prev").click(function(){

+    controlImages(-1)

+  });

+  // eenmalig start waardes schrijven

+  $( "#currentcount" ).text(currentPosition);

+  $( "#totalcount" ).text(totalImages);

+});

Snippets