JQuery UI show / hide with slide effect - how to change the speed of the slide "back"

Question

My page contains many OL lists, each of which displays a list of links. When each link is clicked, the content moves to the right. When you click on each link, the content then jumps back and then again.

Here is a script showing this in action:

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

I would like to slow down the "back" of the slide effect so that it matches the extension speed. You will see that he is currently fast returning - I would like to adjust this speed.

Here's the JS part of the code where the action takes place:

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

Any pointers gratefully appreciated, thanks.

Answer 1

Try to hide it instead

 $(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); }); }); 

Check feed

Answer 2

What about $('.website-info').hide(1400) ? This will hide it as fast as you show the material.

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); });