Skip to content
Not a strong writer of jQuery so for anyone who might improve this, thank you in advance:Your tutorial has converted me into using SASS. I added in some lines of code, but now when I click on a div, the images appear/disappear but no content ( tags) show up. please help! Hi how do I build an accordion within an accordion? I solved it by actually closing all elements :)How ever I have another qestion. when I click on an anchored link to the related tab on the accordion… the screen drops to the bottom of the screen in chrome… no matter where I place my Hi, it is really the better code I’ve found so far. Accordion - React BY Matthew Vincent Accordion component made with React codepen demo See the Pen Accordion - React by Matthew Vincent (@matthewvincent) on CodePen.
Any ideas?forget about my previous question. Also a good idea to use dl/dt.Thanks Chris.
Thank you for sharing that solution!Awesome !!!
This lovely Family Christmas Songbook app can play your favourite Christmas songs hosted on SoundCloud. Sorry I’m pretty new to jQuery, any help would be much appreciated. The headlines must unmistakable scream: Click me, I’m a link! See the Pen Accordion CSS Menu by maggiben on CodePen.
A simple accordion menu that looks great in any project. to the users).If anyone could come up with a solution to get rid of that nasty jump (in IE7 too) and post it here I’d be very grateful.The return false should prevent the jump // but you can also the following: adding an event to the click function and then immediately preventing the default behavior /If the container which is being animated ( the dd) has margin or padding this seems to greatly increase the jump. Is that how you tested it?I had noticed the invalid character after I copied it, thought I had changed them all but must have missed one.
my js fiddle Any idea how to add a window.scrollTo? When I click the icons are jumping.
Triggered after a panel has been activated (after animation completes). How would i tweak it for hyperlinks within the hidden sections? I’m using this in a website for a class, and my teacher is taking away points because the “open drawer” won’t close.If you mean that all of the accordion sections should be closed on start, you can do something like:and that should hide all of the contents of anything with an .accordion class. Many thanks. If the accordion was previously collapsed, ui.oldHeader and ui.oldPanel will be empty jQuery objects. Currently, all hyperlinks disappear which i’m assuming is because of the “$(‘.accordion > dt > a’).click(function() {“. Any idea why that may be the case?If you copied the fix from my previous comment, it does break because of an invalid ‘ character.
I converted from SCSS. Not a strong writer of jQuery so for anyone who might improve this, thank you in advance:Your tutorial has converted me into using SASS. How would I do that out from your code?For those who are looking for a French accordion tutorial, here is a great one : To get the first one to show (previous solution someone posted didn’t work).It can be used as fundamental, but not as advanced.My accordion version at his simplest. I tested it on jsfiddle and it was fine. Slightly more advanced, preventing closing of active panel:Thanks Chris. Sorry, we no longer support Internet Explorer
It turns out the IE7 I had installed on my mac (using Winebottler) wasn’t loading ANY javascript and couldn’t be modified.now all the menu will closed at once, i want one menu should be open and remaining closed, how it can be achieved?
The headlines must unmistakable scream: Click me, I’m a link!