If slideToggle() is called on a list of elements and there is at least one element in the list that is hidden and at least one that is visible, then after the sliding down animation has finished for the hidden elements, any previously hidden element that was listed after the first previously visible element will become hidden again.
If all elements in the list are hidden, then slideToggle() will work as expected (all elements will remain visible after animating).
So, say you have four elements with IDs A, B, C, and D. A, B, and D are currently hidden, and C is visible. If you call $("#A,#B,#C,#D").slideToggle(), then A and B will be visible, and C and D will be hidden after their animations complete.
However, if all elements were hidden to begin with, then they will all be visible after calling the above statement.
This page probably demonstrates it better:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>slideToggle Bug</title>
<style type="text/css">#two, #three { display: none; }</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function t1() { $("#one,#two,#three").slideToggle(); }
function t2() { $("#two,#one,#three").slideToggle(); }
function t3() { $("#three,#two,#one").slideToggle(); }
function t4() { $("#two,#three").slideToggle(); }
function t5()
{
$("#one").slideToggle();
$("#two").slideToggle();
$("#three").slideToggle();
}
</script>
</head>
<body>
<div id="one">I'm number one!</div>
<div id="two">I'm number two!</div>
<div id="three">I'm number three!</div>
<p>
Click to execute:<br />
<a onclick="t1();">$("#one,#two,#three").slideToggle();</a><br />
<a onclick="t2();">$("#two,#one,#three").slideToggle();</a><br />
<a onclick="t3();">$("#three,#two,#one").slideToggle();</a><br />
<a onclick="t4();">$("#two,#three").slideToggle();</a><br />
<a onclick="t5();">$("#one").slideToggle(); $("#two").slideToggle(); $("#three").slideToggle();</a>
</p>
</body>
</html>
I've tried this in FF 2.0.0.7, IE 7, and Opera 9.23, and the bug appears in all three browsers.
