Question

更新

我在网站内部建立了一个响应式手风琴功能，但我对slideToggle功能的动画有问题，因为它不能正常工作，我发现它是由我的标题引起的（标题中的标识未显示这里），因为当我删除它时，动画是平滑的，但我需要标题。也许问题在于我的main.js脚本等更多领域，但我不确定。除了这个问题，我想关闭所有按钮功能，但第一个问题更重要，所以如果有人可以帮助我吗？

此处示例：Fiddle

必须得到帮助，谢谢！

<header class="fadeIn" id="logo"></header>      

<div class="read-more">Scroll voor meer</div>

<section id="line"></section>

<section id="container">
    <div class="header"><h1>Het verhaal</h1></div>
    <div class="content"><p>Alles wat hier staat is slechts om een indruk te geven van het grafische effect van tekst op deze plek. Wat u hier leest is een voorbeeldtekst. Deze wordt later vervangen door de uiteindelijke tekst, die nu nog niet bekend is. De faketekst is dus een tekst die eigenlijk nergens over gaat.</p>
    <p>Het grappige is, dat mensen deze toch vaak lezen. Zelfs als men weet dat het om een faketekst gaat, lezen ze toch door. Kijk eens hoe een link <a href="#">test@google.nl</a> eruit ziet. </p></div>
</section>

<section id="line"></section>

<section id="container">
    <div class="header"><h1>DJ/bands</h1></div>
    <div class="content"><p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusan tium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore <a href="#">architecto</a> veritatis et quasi  beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.</p>
    <p>Nulla viverra condimentum sem, a rhoncus lectus. Fusce pharetra non magna eu venenatis. Cras fringilla aliquam erat, vitae imperdiet nisl congue id. Ut pellentesque pellentesque lorem a aliquet. Ut imperdiet tortor in metus pretium, in aliquet nisl tempus.</p></div>
</section>

旧问题（这是主题的开头）：

（我建立了一个全宽度部分和文本居中的网站，但我希望它能够作为一个手风琴使用并在点击时打开它的内容（向下滑动动画）！当打开时有一个topcorner关闭按钮，当其他人打开时保持打开状态。当打开时，文本上不再有悬停颜色等。在小提琴中，我将文本包装器显示为'无'作为例子）

Answer 1

您可以检索点击的元素，然后导航到它的父级。

$(".header-wrapper").click(function(){
    $(".text-wrapper",$(this).parent()).slideToggle();
})

请参阅http://jsfiddle.net/nh6dmr5q/

单击UPDATE打开手风琴全宽部分：平滑slideToggly

1 个答案: