本文介绍了JQuery-Mobile可折叠slideDown效果的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想用data-role='collapsible'
向div
添加slideDown
或slideUp
效果,因此它不会立即打开而是逐渐打开.
I want to add a slideDown
or slideUp
effect to a div
with data-role='collapsible'
, so it will not open at once but gradually.
我已经尝试过了:
$('#my-collapsible').live('expand', function() {
$('#my-collapsible .ui-collapsible-content').slideDown(2000);
});
$('#my-collapsible').live('collapse', function() {
$('#my-collapsible .ui-collapsible-content').slideUp(2000);
});
但是它仍然可以立即打开和关闭.
But it still opens and closes without delay.
任何人都知道我该怎么称呼那些slideDown
和slideUp
方法?
Anyone knows how should I call those slideDown
and slideUp
methods?
推荐答案
实时示例:
- 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>
这篇关于JQuery-Mobile可折叠slideDown效果的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!