<h3>使用slideToggle()方法切换滑动效果</h3>

        <div>

            <h4>

               <span class="fl">我喜欢吃的水果</span>

               <span class="fr" id="spnTip">向下滑</span></h4>

            <ul>

                <li>苹果</li>

                <li>甘桔</li>

                <li>凤梨</li>

                <li>香蕉</li>

                <li>柚子</li>

                <li>西瓜</li>

                <li>香瓜</li>

                <li>葡萄</li>

                <li>甜橙</li>

            </ul>

            <input id="hidval" type="hidden" value="0"/>

        </div>

        <script type="text/javascript">

            $(function () {

                var $spn = $("#spnTip");

                $("h4").bind("click", function () {

                    $("ul").slideToggle(3000,function(){

               $spn.html() == "向下滑" ? $spn.html("向上滑") : $spn.html("向下滑");

                    })

                })

            });

        </script>