[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