JQuery UI平滑列动画
JQuery UI平滑列动画
提问于 2014-02-06 12:31:23
我有一个表，它具有展开/撤回列的选项。使用JQuery UI Toggle幻灯片，我有它，所以它‘幻灯片’进进出出。然而，这不是一个非常平稳的过渡，看上去相当糟糕的时候，按钮点击。
这是JS小提琴http://jsfiddle.net/LhsS4/
这是我所使用的基本版本，即使在这里，您也可以看到一些口吃，当您添加表边框时，这一点就更加明显了。
这是JQ
$(function () {
$('.toggleoff').hide;
$('.newtoggle').on('click', function () {
$('.toggleoff').toggle("drop", 250);
});
});这是HTML
<button class ="newtoggle" alt="Expand"> Click me </button>
<table id="tblMainData" class="tablesorter">
<thead>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th class="toggleoff">7</th>
<th>8</th>
</tr>
</thead>
<tbody>
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
<td>e</td>
<td>f</td>
<td class="toggleoff">g</td>
<td>h</td>
</tr>
<tr>
<td>i</td>
<td>j</td>
<td>k</td>
<td>l</td>
<td>m</td>
<td>n</td>
<td class="toggleoff">o</td>
<td>p</td>
</tr>
</tbody>
</table>我试过调整过渡的速度，但这仍然不能修复它。我认为主要的问题是，当它切换表数据字段边框时，不会滑入，它们以倾斜的方式出现，直到数据停止。有什么办法把它弄平吗？
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-02-06 12:59:56
一般来说，jquery在动画方面做得更好。http://api.jqueryui.com/slide-effect/
如果将jQuery UI添加到代码中，将获得比使用标准jQuery切换函数更好的效果。
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>下面是一个摆弄它的人：http://jsfiddle.net/LhsS4/10/
一般来说，我会尽量避免使用表格来进行布局，表格是不存在的(除非你是在电子邮件中发送表格，在这种情况下，布局表是可行的方法)。如果需要表，请尝试使用display属性。
https://developer.mozilla.org/en-US/docs/Web/CSS/display
http://www.vanseodesign.com/css/tables/
祝你好运！)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21603073
复制相关文章
相似问题
腾讯云开发者
