javascript - Jquery / AJAX 滑动菜单 - CrazyEgg - 与常见问题一起使用

Question

我在弄清楚 Crazy Egg 用于他们的常见问题解答时遇到了一些麻烦，我想完全实现同样的事情（点击时问题会向下滑动 - 并为当前的活动问题显示一个蓝色框）。

例如）https://www.crazyegg.com/help

我浏览了代码，发现它有 javascript 事件，但我无法自己编写脚本。有没有可以用于这种行为的插件？我认为某种形式的显示/隐藏 div？

Answer 1

您应该能够使用 jquery 自己编写代码。只需查看非常基本的 jQuery 教程，其中包含选择器、隐藏和显示以及单击事件。您所做的就是为您单击的每个标题分配一个 id，然后在单击时隐藏所有内容并显示单击的内容。您应该在线阅读一些东西，尝试一些东西，然后返回代码并提出问题。

Answer 2

这个效果可以通过jQuery的slideToggle函数轻松实现：

HTML：

<span class="faq">This is a FAQ question...</span>
<div class="answer" style="display: none;">
    And this is the answer.
</div>

JavaScript：

$(document).ready(function(){
    $(".faq").click(function(){
        $(this).next("div.answer").slideToggle();
    });
});

JSFiddle：http: //jsfiddle.net/ySahP/