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

问题描述

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

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

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

谢谢.

解决方案

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

HTML

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

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

jQuery

$(function() {$('.body').hide();$('.heading').hover(function() {$(this).next('.body').stop().slideToggle(500);$(this).parent().siblings('.wrap').children('.body').stop().slideUp(500);}， 功能() {$(this).next('.body').stop().slideToggle(500);});});

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/

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.

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

Thanks.

解决方案

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屋！