Comments on: Image Replacement Gallery

By: greg

greg — Mon, 28 Jun 2010 16:21:46 +0000

Hi Ben
Love the tutorial! Quick question, how hard would it be to expand this example to automate the switching of the images, say every 5 seconds? I’m struggling a little bit with making this work in my working example.

By: Ben

Ben — Sat, 25 Jul 2009 15:16:51 +0000

Hi Adrian,

Thanks for the comment! I have e-mailed you in regards to updating the code with the requested additional features.

By: adrian

adrian — Fri, 24 Jul 2009 02:33:03 +0000

WOW,
I am a newcomer to js and jquery and I too had stumbled across the Web Designer Wall example while looking for a portfolio gallery for my site.
I have modified the script to include a hover on the thumbnails and was starting to look at some way of fading in and out the large images.-
$(document).ready(function(){

$(“h5″).append(‘‘)

$(function() {
$(‘#navrollover img’).animate({“opacity”: .7 });

$(‘#navrollover img’).hover(function() {
$(this).stop().animate({ “opacity”: 1 });
}, function() {
$(this).stop().animate({ “opacity”: .7 });
});
});

$(“.thumbs a”).click(function(){

var largePath = $(this).attr(“href”);
var largeAlt = $(this).attr(“title”);

$(“#largeImg”).attr({ src: largePath, alt: largeAlt });

$(“h5 em”).html(” ” + largeAlt + “”); return false;
});

});

I was also using the variable alt data to provide a description of each large image.
I currently have a working example at – http://rosa.actewagl.net.au/graphic_design_c1_p1C.html

Is it possible to add the thumb hover event and variable alt data function to your new gallery?? Because it is much better!

By: Mark Boas

Mark Boas — Thu, 23 Jul 2009 13:16:21 +0000

I was looking for something like this to use on this site : http://paolobenvenuti.com

Thanks!