Saturday, November 21, 2009

[jQuery] jCarousel + Galleria doesn't work properly

This is what I've got so far: http://zek.nma.sg/ (I'm implementing
jQuery in Wordpress)

This is what I'm trying to get: http://tinypic.com/r/mtqfmc/6

The following is an example of an implementation of Galleria and
jCarousel, but I couldn't get their tutorial to work for me:
http://themeforest.s3.amazonaws.com/86_jquery/gallery.html

Right now, I've got the Galleria working but the jCarousel doesn't
seem to be.

How do I get jCarousel to limit the number of thumbnails on the bottom
to 3 or 4, and how do I get the arrows to show?

Code:

jQuery(document).ready(function($){

$('ul.gallery').galleria({
history: false,
// function fired when the full size image is displayed
onImage: function(image, caption, thumb) {

// fade in the image
image.hide().fadeIn(1000);

// animate active thumbnail's opacity to 1, other list elements to
0.6
thumb.parent().fadeTo(200, 1).siblings().fadeTo(200, 0.6);
thumb.parent().css('border-color','#fff').siblings().css('border-
color','#6b6b5b');
},

// function similar to onImage, but fired when thumbnail is displayed
onThumb: function(thumb) {
var $li = thumb.parent(),
opacity = $li.is('.active') ? 1 : 0.6;

// hover effects for list elements
$li.hover(
function() { $li.fadeTo(200, 1); },
function() { $li.not('.active').fadeTo(200, opacity); }
)
}
}).find('li:first').addClass('active'); // displays first image when
Galleria is loaded

$('ul.gallery').jcarousel({
start: 1,
scroll: 1,
size: 4

})


})

Thanks.

0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]

<< Home


Real Estate