jquery - 滑动图像而不是淡入

Question

我制作了一个简单的图片库，在点击拇指图片时图片会淡入。我想要改变的是拇指图像单击请求的画廊图像不会淡入，而是向左/向右滑动。

http://jsfiddle.net/TfEn4/

$('.fotos').not(':first').hide();
$('.info').not(':first').hide();

$('.gal-links ul li a').click(function() {
    var activeLink = $(this).attr('href');
    $('.info').hide();
    $('.gal-links ul li a').removeClass('active');
    $(this).addClass('active');
    $('.fotos').hide();
    $(activeLink).fadeIn('slow');
    $('.info').fadeIn('slow');
    return false;
});

我应该如何为此更改我的代码？动画和定位是正确的方式吗？

Answer 1

使用 Jquery UI 的幻灯片效果或使用 animate() 方法作为宽度属性

$(activeLink).toggle( "slide" );

这是幻灯片效果的小提琴。

对于使用动画方法，您可以这样做

$(activeLink).show('slide', {direction: 'right'}, 1000);

并且为了隐藏

$(activeLink).hide('slide', {direction: 'left'}, 1000);