1

提前感谢您的帮助。

我正在使用 jQuery UI 手风琴，我希望有一个动画，但由于某种原因它不起作用。知道为什么吗？手风琴 div 只是出现和消失。这是我的代码：

      <!-- creates  accordion where records can be entered -->
                    <script type="text/javascript">

        $(document).ready(function(){

            $( "#tracking-record-menu" ).accordion({
                collapsible: true,
                    header: '.record-item',
                active: false,
                animated: 'slide'
            });

                            });

                    </script>    

          <!--######### contains tracking record buttons ######## -->
               <div id="tracking-record-container"> 
          <ul id="tracking-record-menu">

<li class="record-section"><span class="record-section-text">Body Metrics</span></li>

<li class="record-item"><div class="record-item-div"><span class="record-text">Distance</span></div></li>

                     <div class="tooltip-record">
                     <form id="distance_graphtracker" method="post" action="">
                     <label for="distance-log-id">Distance</label>
         <input type="text" name="distance_log" id="distance-log-id" />
                     <button type="submit" name="submit_distance" >Record</button>
                     </form>
                     </div>

<li class="record-item"><div class="record-item-div"><span class="record-text">Time</span></div></li>

                     <div class="tooltip-record">
                     <form id="time_graphtracker" method="post" action="">
                     <label for="time-log-id">Time</label>
          <input type="text" name="time_log" id="time-log-id" />
                     <button type="submit" name="submit_time" >Record</button>
                     </form>
                     </div>

</ul>
</div>

PS 我已经包含了 UI 效果核心。

4

2 回答 2

1

如果您使用以下 CSS，您的动画可能会被破坏：

.accordion_item_content { height: auto !important; }

因为在这种情况下，该元素无法设置动画（您覆盖所有更改）。在这种情况下，您应该在手风琴中使用选项 autoHeight: true。

于 2012-08-15T15:04:46.077 回答
0

我用你的代码做了一个小提琴，但幻灯片效果看起来是正确的：http: //jsfiddle.net/Xzjum/

你能包括你的CSS，也许有什么影响幻灯片动画？

于 2012-06-04T13:18:08.880 回答