Tabs 点击li get fade in，使用“延迟/暂停”效果淡出；rel"；单个div中的属性

我有5行相同的

ul

li

，如下所示。每当我点击任何一个

li

（

li

将被选中），它将打开/显示一个

popover

或一个

div

，淡入并暂停几次，然后淡出。我对

ul

及其父类

div

使用相同的类

<div class="choices">
    <ul class="question-choices"> 
        <li><a rel="0" href="#tab1" class="active">a</a></li>
        <li><a rel="1" href="#tab2">b</a></li>
        <li><a rel="2" href="#tab3">c</a></li>
        <li><a rel="3" href="#tab4">d</a></li>
        <li><a rel="4" href="#tab5">e</a></li>
    </ul>
</div>
<div id="tab1” class=”content”>aaaa</div>
<div id="tab2” class=”content”>bbbb</div>
<div id="tab3” class=”content”>cccc</div>
<div id="tab4” class=”content”><dddd/div>
<div id="tab5” class=”content”>eeee</div>

如何在其中添加淡入、淡出和暂停效果。如何为其使用“rel”属性。我是否可以对所有的

popover

只使用一个

div

，并通过html/text更改其内容

---

请告诉我如何实现它或任何我可以找到它的简单示例（我仍在学习）。

不要为此滥用

rel

属性。如果您使用的是HTML5，请改用

data-*

属性。

$(". content ").hide();
    $("ul.question-choices li").click(function() {
    $("ul. question-choices li").removeClass("active"); 
    $(this).addClass("active");
$(". content ").hide(); 

var activeTab = $(this).find("a").attr("href"); 
$(activeTab).fadeIn();