Kevin Meijvis
Kevin Meijvis

Reputation: 41

Change picture and background on click

I have a little problem with my test-site i'm making.

I love experimenting with Javascript but i'm getting stuck on this little code...

What i'm trying to reach:

When you click on a picture below, the picture will become visible in the main of the page, and also in the background. When you click in the main of the page ( where the picture is visible ), it will automaticly go to the next one.

What I have right now:

I already made a popup window, and now starting the pictures. I already inserted a code, but it don't seem to open very well. I tried alot but it's still not working.

jQuery

What I have tried to do is:

$('#photo').fadeIn();
$("#gallery ul li").on("click", function() {
var selector = '#photo[src="' + $(this).attr('href') + '"]';

$(".selected").hide();

$('selector').fadeIn();
return false;
});

$('#gallery ul li').on('click', function() {
$("#photo").hide();
var next = $(this).next();
if (next.length > 0) {
    next.fadeIn();    
} else {
    $('.selected').fadeIn();
}
return false;
});

Also I have made a jsFiddle where I have input the HTML & CSS.

Live Demo

Upvotes: 3

Views: 99

Answers (1)

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114367

$('selector').fadeIn(); is looking for an HTML tag called "selector". There is no such tag.

To use the variable you defined, lose the quotes.

$(selector).fadeIn();

Upvotes: 2

Related Questions