3385

Vertical Accordion Content Slider ideally jQuery

Question:

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

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.

Answer1:

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

<strong>HTML</strong>

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

<strong>jQuery</strong>

$(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); }); });

Answer2:

There is JQuery UI which is almost the brother of JQuery and it has a lot of useful widgets including an accordion:

<a href="http://jqueryui.com/demos/accordion/" rel="nofollow">http://jqueryui.com/demos/accordion/</a>

Answer3:

There's a really cool image and accordion jQuery plugin I developed called Slidorion. it combines an image slider and an accordion so might be what your looking for. Check it out...

<a href="http://www.slidorion.com" rel="nofollow">http://www.slidorion.com</a>

Recommend

  • Vertical-align: middle
  • How to animate float:left divs? [closed]
  • What's effective way to write Vaadin project ?
  • .Net chat room system
  • Replacing points of color by a uniform colored surface
  • ReplaceWith carousel-inner with new items
  • How to push ViewController with slide effect from left to right? Animation name required
  • Transition height onload of d3js rect svg
  • Bootstrap Carousel Next/Prev not working
  • How to read a certificate from a USB token in C#
  • CreateWindowEx fails with ERROR_CANNOT_FIND_WND_CLASS
  • “Complex Header” not responsive in current DataTables.net build?
  • Ruby regex to remove all consecutive letters from string
  • Android: how to determine cold start
  • Implementation of RTTI using typeid
  • Using an STL Iterator without initialising it
  • Regex for Specific Tag
  • How can we prepend rows to a react native list-view?
  • joining two bezier curves
  • Azure webjobs output logs indexing taking very long
  • Eclipse MTJ doesn't see Java ME SDK 3.0 devices
  • How to make jdk.nashorn.api.scripting.JSObject visible in plugin [duplicate]
  • What's the purpose of QString?
  • ADO and msqli connections very slow
  • Marklogic : Query response time is very high
  • Jackson Parser: ignore deserializing for type mismatch
  • print() is showing quotation marks in results
  • How to use remove-erase idiom for removing empty vectors in a vector?
  • Q promise. Difference between .when and .then
  • Illegal mix of collations for operation for date/time comparison
  • Does CUDA 5 support STL or THRUST inside the device code?
  • Fill an image in a square container while keeping aspect ratio
  • retrieve vertices with no linked edge in arangodb
  • How to set the response of a form post action to a iframe source?
  • Change div Background jquery
  • Can Visual Studio XAML designer handle font family names with spaces as a resource?
  • Qt: Run a script BEFORE make
  • How can I remove ASP.NET Designer.cs files?
  • Are Kotlin's Float, Int etc optimised to built-in types in the JVM? [duplicate]
  • reshape alternating columns in less time and using less memory