Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- // first thumbnail is always the current image, so it
- // should start out being selected
- $('#photo_gallery ul li:first-child img').addClass('selected');
- // set the last thumbnail's margin to 0
- $('#photo_gallery ul li:last-child').addClass('last');
- // all thumbnails should begin with lower opacity
- $('#photo_gallery ul img').animate({ opacity: 0.75 }).hover(
- // on mouseover:
- function(e) {
- var thumbnail = $(e.target);
- // selected status should be removed from all thumbnails
- thumbnail.parent().siblings().children().removeClass('selected');
- // thumbnail opacity should go back up to 100%
- thumbnail.stop().animate({ opacity: 1 }, "fast");
- // thumbnail should become selected
- thumbnail.addClass('selected');
- // main image should be updated with thumbnail image
- var new_photo = thumbnail.attr('src').replace('_thumbnail','');
- $('#photo_gallery img#main').attr('src', new_photo);
- },
- // on mouseout:
- function(e) {
- // opacity should drop back down
- $(this).stop().animate({ opacity: 0.75 });
- }
- );
Add Comment
Please, Sign In to add comment