我想将一个slideDown或slideUp效果添加到具有data-role =’collapsible’的div中,因此它不会立即打开而是逐渐打开.
我试过这个:
$('#my-collapsible').live('expand',function() { $('#my-collapsible .ui-collapsible-content').slideDown(2000); }); $('#my-collapsible').live('collapse',function() { $('#my-collapsible .ui-collapsible-content').slideUp(2000); });
但它仍然可以毫不拖延地打开和关闭.
解决方法
实例:
> http://jsfiddle.net/6txWy/6/
> http://jsfiddle.net/6txWy/7/
JS
$('#my-collaspible').bind('expand',function () { $(this).children().slideDown(2000); }).bind('collapse',function () { $(this).children().next().slideUp(2000); });
HTML
<div data-role="page"> <div data-role="content"> <div data-role="collapsible" id="my-collaspible"> <h3>My Title</h3> <p>My Body</p> </div> </div> </div>