jquery - 带有幻灯片效果的 jQuery UI 显示/隐藏 - 如何更改幻灯片“后退”速度

Question

我的页面包含许多 OL 列表，每个列表都显示了一系列链接。单击每个链接时，内容会向右滑出。单击每个链接时，内容会滑回，然后再次滑出。

这是一个 Fiddle 展示了这一点：

http://jsfiddle.net/juxprose/xu3ck/15/

我想减慢幻灯片效果的“后退”部分，使其与滑出的速度相匹配。你会看到它现在很快滑回 - 我想调整这个速度。

这是代码的 JS 部分，其中发生了操作：

$('.trg-open.website-title').click(function (e) {
 e.stopPropagation();
 $('.website-info').hide();
 $(this).next('.website-info').show('slide', {direction: 'left'}, 1400);
});

任何指针不胜感激，谢谢。

Answer 1

试试这个而不是隐藏它

$(document).ready(function(){
    $('.trg-open.website-title').click(function (e) {
    e.stopPropagation();
    $('.website-info').hide('slide', {direction: 'left'}, 1400);
    $(this).next('.website-info').stop().show('slide', {direction: 'left'}, 1400);
   });
});

检查小提琴

Answer 2

怎么样$('.website-info').hide(1400)？这将以与您显示内容完全相同的速度隐藏它。

Answer 3

$('.trg-open.website-title').click(function (e) {
 e.stopPropagation();
 $('.website-info').hide(1400); //You can set a duration-time in millisec ;)
 $(this).next('.website-info').show('slide', {direction: 'left'}, 1400);
});