var showcase = $("#img_big"); var showcaseLink = $("#img_big_link"); var photoBackButton = $("#photo_back_button"); /* * Display selected image in showcase * When clicked, display image in full size */ function displayBig(elem) { changeImage($(elem).attr('src')); photoBackButton.css("display", "block"); } /* * Hide showcase image */ function closeBig() { photoBackButton.css("display", "none") } /* * Display next/last image in showcase. When reaching end/start, loop back to start/end */ function displayNext(direction) { var currentSrc = showcase.attr('src'); var photos = document.getElementsByClassName("photo"); var current = 0; for (i = 0; i < photos.length; i++) { if ($(photos[i]).attr('src') == currentSrc) { current = i; } } var next = current + direction; var nextId = ""; if (direction > 0) { nextId = "#photo-0"; } else { nextId = "#photo-" + (photos.length - 1); } if (document.getElementById("photo-" + next) != null) { nextId = "#photo-" + next; } var nextSrc = $(nextId).attr('src'); changeImage(nextSrc); } /* * Change image source and link */ function changeImage(src) { showcase.attr("src", src); showcaseLink.attr("href", src); }