我在我的jQuery手机1.4.0应用程序中有以下可折叠设置,我需要添加一个动画到这个可折叠设置时,它的展开和关闭,我已经试过这个代码和其在jsfiddle中的工作正常,这是我的jsfiddle,但问题是动画不适用于我的应用程序与jQuery的移动1.4.0。我如何使这个动画在jQuery移动1.4.0上工作?请帮助我..可折叠设置不工作在jQuerymobile 1.4.0的自定义动画
JavaScript代码进行动画
<script>
$('document').on('pageinit',function(){
animateCollapsibleSet($("[data-role='collapsible-set'] > [data-role='collapsible']"));
});
// animation speed;
var animationSpeed = 200;
function animateCollapsibleSet(elm)
{
// can attach events only one time, otherwise we create infinity loop;
elm.one("expand", function() {
// hide the other collapsibles first;
$(this).parent().find(".ui-collapsible-content").not(".ui-collapsible-content- collapsed").trigger("collapse");
// animate show on collapsible;
$(this).find(".ui-collapsible-content").slideDown(animationSpeed, function() {
// trigger original event and attach the animation again;
animateCollapsibleSet($(this).parent().trigger("expand"));
});
// we do our own call to the original event;
return false;
}).one("collapse", function()
{
// animate hide on collapsible;
$(this).find(".ui-collapsible-content").slideUp(animationSpeed, function() {
// trigger original event;
$(this).parent().trigger("collapse");
});
// we do our own call to the original event;
return false;
});
}
</script>
检查这个http://jsfiddle.net/Palestinian/3LvQh/ – Omar
@OmarThanks它的工作,但有两个问题:第一个,如果我扩大Governorate1然后展开Governorate2的Governorate1没” t自动关闭,我需要点击它2次才能关闭它当我们点击前面的例子Governorate2时,我们怎样才能更新这个代码,如果Governorate1展开它将自动关闭。 – user
Omar的代码关闭其他打开的可折叠的代码的小更新:http://jsfiddle.net/ezanker/3LvQh/3/ – ezanker