Jquery mobile 如何设置jQuery移动选项卡的动画

我想制作jQuery移动标签内容的动画。我有两个标签。从左侧选项卡开始，显示其内容。单击右侧选项卡时，右侧选项卡的内容从右侧滑入。我让这部分工作。我正在使用此脚本制作动画：

$(document).on("tabsbeforeactivate", "#tabs", function (e, ui) {
    $(ui.newPanel).addClass("in slide").one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {
        $(this).removeClass("in slide");
    });
});

请参见此处的JSFIDLE：

奥马尔的回答是：

下面是我需要的帮助：当你点击左选项卡时，我希望左选项卡的内容从左边滑入。目前，它正在从右侧滑入。我对Javascript不是很有经验，在jQueryMobile的网站上也找不到任何帮助

有人能帮我修改脚本吗？这样当点击左边的标签时，它的内容就会从左边进入

谢谢大家!

检查

newPanel

和

oldPanel

的

.index（）

，如果

newPanel

的

.index（）

大于

oldPanel

的索引，则添加类

reverse

$(document).on("tabsbeforeactivate", "#tabs", function (e, ui) {
    var reverse = ui.newPanel.index() < ui.oldPanel.index() ? " reverse" : "",
        classes = "in slide" + reverse;
    $(ui.newPanel).addClass(classes).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {
        $(this).removeClass(classes);
    });
});

$（document）.on（“tabsbeforeactive”，“#tabs”，函数（e，ui）{
var reverse=ui.newPanel.index（），
class=“在幻灯片中”+反转；
$（ui.newPanel）.addClass（classes）.one（'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend'，函数（）{
$（this）.removeClass（类）；
});
});

---

工作得很有魅力！谢谢，你是jQuery移动noobs的圣人。