1 big image & Thumbnails-Gallery - how to update the url
Hi there!
I've got the "1 big image & Thumbnails - Gallery" working so far, the big image should also link to a bigger image...
the problem is now, that the url to the bigger image doesn't change, when the image linking to it changes. so, till now clicking on the big image (no matter which one is selected) will show the first big image of that gallery. the bigger images got the same filename but with an "big_" attached in front. my JS is:
-
$(document).ready(function() {
});
$("div.hoverthumb").click(function() {
$('.aktiv').removeClass('aktiv');
$(this).addClass('aktiv');
});
function showPic(url,title,descr,width,height) {
$("#maxImage").fadeOut("slow", function(){
var image = new Image();
$(image).load(function() {
$(this).hide();
// with the holding div #loader, apply:
$('#picturecontainer')
// remove the loading class (so no background spinner),
.removeClass('loading')
// then insert our image
.append(this);
$("#maxImage").attr({ src: url, width: width, height: height});
$("#maxImage").fadeIn("fast");
$("#maxTitle").html(title);
$("#maxDescr").html(descr);
$('#picturecontainer').addClass('loading')
});
$(image).attr({src: url, width: width, height: height,});
});
}
and the html of the big image, linking to the bigger one:
-
<div id="picturecontainer" class="loading">
<a id="bigimage" href="/assets/galleries/55/big_portugal132.jpg" rel="lightbox">
<img id="maxImage" src="/assets/galleries/55/portugal132.jpg" alt="" />
</a>
</div>
does anybody know how to solve this?
best regards, j