垂直手风琴内容滑块，最好是 jQuery [英] Vertical Accordion Content Slider ideally jQuery

问题描述

我一直在寻找垂直手风琴内容滑块.我找到了一个:http://www.marghoobsuleman.com/jQuery-common-accordion，还不错.我在我的网站 http://www.pixeltrics.com/

I've been searching for a while for a vertical accordion content slider. I've found one: http://www.marghoobsuleman.com/jQuery-common-accordion, and it's pretty good. I implemented it on my site http://www.pixeltrics.com/

但有几件事我不满意.它不是很流畅，即使我将自动延迟时间设置为 4 秒，但似乎第一张幻灯片切换到第二张幻灯片需要更长的时间，然后它们开始像每秒一样切换.所以有些地方不太对劲.

But there are a couple of things I'm not happy with. It's not very smooth, and even though I set the autodelay time to 4 seconds, it seems the first slide takes a lot longer to switch to the second and then they start switching like every second. So something isn't quite right.

有谁知道我可以尝试的另一个垂直手风琴插件吗?理想情况下是 jQuery 的.

Does anyone know of another vertical accordion plug-in I can try? Ideally a jQuery one.

谢谢.

推荐答案

如果单独使用 jQuery 就足够简单，为什么还要使用插件呢?示例...

Why use a plugin when it's easy enough with jQuery alone? Example...

HTML

<div class="wrap">
    <div class="heading">Heading</div>
    <div class="body">Body</div>
</div>
<div class="wrap">
    <div class="heading">Heading</div>
    <div class="body">Body</div>
</div>
<div class="wrap">
    <div class="heading">Heading</div>
    <div class="body">Body</div>
</div>

jQuery

$(function() {

    $('.body').hide();              

    $('.heading').hover(function() {

        $(this).next('.body').stop().slideToggle(500);
        $(this).parent().siblings('.wrap').children('.body').stop().slideUp(500);

    }, function() {

        $(this).next('.body').stop().slideToggle(500);

    });
});

这篇关于垂直手风琴内容滑块，最好是 jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！