Jquery mobile 是否可以设置列表视图部分替换的动画

我的清单由两部分组成：

<ul data-role="listview"  data-theme="a" data-inset="true" data-split-theme="c">

        <li>
            <a style="padding-top:0">
                <h5>Text 1</h5>
                <p><strong>Text 2</strong></p>
                <p>Date: April 17, 2012</p>
            <a href="http://some address" ></a>
        </li>

我想做的是，当用户单击一行左侧部分的任意位置时，我想播放一个音频文件（使用html5标记），并将此部分中的文本删除，并替换为播放音频的音频控件。当用户停止音频时，我希望一切恢复原状

我不熟悉JQuery和JQueryMobile，不知道从哪里开始

理想情况下，如果可能，当音频控件出现时，如果可以出现某种翻转动画，例如，行的某一部分旋转，一边是音频控件，另一边是文本，那就太好了。 这可能吗

---

TIA

您可以在

li

中嵌套任何您想要的内容，因此您只需在其中放置两个

div

容器，并绑定到适当的事件，并基于此显示和隐藏它们

例如：

标记：

<ul id="parentUL" data-role="listview"  data-theme="a" data-inset="true" data-split-theme="c">
        <li>
            <a  style="padding-top:0">
                <div class="txtCnt">
                <h5>Text 1</h5>
                <p><strong>Text 2</strong></p>
                <p>Date: April 17, 2012</p>
                </div>
                <div class="audioCnt displayNone">
                    <h1>Audio Controls</h1>
                </div>
        <a href="http://some address" ></a>
    </li>
    </ul>

---

我能想到怎么做，但我不在电脑前。稍后我会在我的电脑前测试它，如果其他人不抢先一步，我会帮助你。祝你好运

$('#parentUL').on('click', '.txtCnt', function () {
    $(this).hide().parent().find('.audioCnt').show();
});

$('#parentUL').on('click', '.audioCnt', function () {
    $(this).hide().parent().find('.txtCnt').show();
});