FAQ Database Discussion Community


Convert Jquery Accordion to Nested Accordion

javascript,jquery,jquery-accordion
I have used JQuery Accordion to successfully hide elements that can then be opened by clicking on header, but I needed an additional level of nesting - something that Accordion does not support So Ive been trying to use Nested Accordion, even without make any other changes just importing the...

Append to vertical accordion on button click jquery

jquery,html5,accordion,jquery-accordion
I have a horizontal tabs, and inside that, I have a vertical tab functionality. In the vertical tab, I have provided a button called Add More like this: <button id="addMore" type="button">Add More</button> On click of the button, I want to append new tab to the previous one. click method on...

Accordion menu jquery doesn't work

jquery,menu,jquery-accordion
I'm trying to achieve an accordion menu in jquery, However it doesn't seem to work, and my submenu doesnt appear . .. I've try various possibility by changing my jquery but nothing to do :(, any help would be amazing !! I attach my code below: html: <div class="content-left"> <ul...

Jquery simple accordian

javascript,jquery,accordion,jquery-accordion
I have simple Jquery accordian, but i have problem of changing header color when tab is opened Here is my code HTML <dl class="accordion-modal"> <dt><a href=""><header>FIRST</header></a></dt> <dd class="active-accordian">FIRST CONTENT</dd> <dt><a href=""><header>SECOND</header></a></dt> <dd>SECOND CONTENT</dd> </dl> JS (function($) { var allPanels = $('.accordion-modal > dd').hide(); $('.accordion-modal >...

Jquery accordion unknown content divs

jquery,accordion,jquery-accordion
Effectively I want to say: "Grab all content between each occurrence of this class and wrap it up as a section. I've got a standard implementation function hubTasks() { $("#Form_Form").accordion({ header: ".FormHeading", collapsible: true, active: false, autoHeight: false, autoActivate: true }); } But obviously only collects the first div under...

JQuery Queue issues

javascript,jquery,jquery-animate,jquery-accordion,jquery-queue
I am having some serious issues making the JQuery queue work. All the defined functions execute at once, so the class change occurs before the animation- we want it to fade out, then change class, THEN fade back in. function animatePlusMinus(){ if ($(this).hasClass("ui-icon-minus")) { $(this).queue("goPlus",function(next) { $(this).fadeOut(500); next(); }) .queue("goPlus",...

jQuery multi-level accordion menu

jquery,html,menu,accordion,jquery-accordion
I found some accordion menus online but either they did not support multiple levels, or the code was quite cryptic and I didn't want to use it. So I decided, that I want to write my own accordion menu, which supports an arbitrary number of sub-menus. Here is what I...

jQuery accordion header arrows

jquery,jquery-accordion
I have an accordion that is not behaving the way I want it to. I want to have a list of sections that has a nice red arrow pointing to the right. Then when I open it, I want the arrow to point down. Problem is this is that the...

Trouble completing this jQuery .slideUp code

jquery,accordion,jquery-accordion
Okay, first and foremost I'm a newbie to jQuery (my background is purely HTML5 / CSS3 and graphics). Anyways, I'm working on a jQuery menu (trying to learn at the same time) that opens and closes like an accordion. I've got the first part of the menu working. When someone...

Accordion - How to not have first item expanded?

javascript,jquery,jquery-accordion
I'm working on a site with a Accordion "function" based on this: http://jqueryui.com/accordion/#collapsible My only problem is that the first Section is open by default and I want every Section to be closed until the visitor presses them. Someone know how to solve this? Code: <!doctype html> <html lang="en"> <head>...

How to save a nested JqueryUI accordian's state and reopen it by reading later

javascript,jquery,jquery-ui,jquery-accordion,jquery-ui-accordion
Hi I am dealing with a very nested accordion. What I want to do is whenever the user changes the state of the accordion I want to record that change in the URL so that when I refresh I can read the URL and create a new accordion with the...

Push down footer when opening accordion

jquery,html,css,accordion,jquery-accordion
I have an accordion as my nav that I have fixed on the page but when opening the accordion it overlaps my footer, I have looked around and people are having the same problem but I can't seem to get any of the solutions to work with mine. .servicesub {...

click only the header not its specified children

javascript,jquery,accordion,jquery-accordion
I have this html <div class="accordion_wrapper"> <div class="accordion_header"> <h1>Accordion Test</h1> <select> <option value="" selected disabled>Options</select> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> </select> </div> <!-- end of accordion header --> <div class="accordion_content"> <p>this is the accordion content</p> </div>...

REMOVE Accordion Panel using Jquery

jquery,html,accordion,jquery-accordion,removeclass
While searching, I can mostly find how to add a panel using Jquery Accordion and got that to work no problem. BUT, how do I remove the same panel that I added? I have this fiddle:http://jsfiddle.net/cof7ojky/12/ working which adds a panel to the according. BUT now I want to REMOVE...

jquery accordion get height value

jquery,height,jquery-accordion,value
I'd like to get the height value of the individual panels when active. I know I can use $(document).height() or $(window).height(), but I want to actual height value of the active panel. Is this possible? <ul id="allTabs"> <li><a id="tab-1" href="#buildTab" onclick='windowResize("mainAccordion");' >Build</a></li> <li><a id="tab-5" href="#setupTab" onclick='windowResize("setupAccordion");'>Setup</a></li> </ul> function windowResize(what){ var...

Accordion Toggle Arrows

javascript,jquery,css,accordion,jquery-accordion
I'm trying to work out how I can reset my toggle arrows when opening another accordion panel when one is already open. I have managed to toggle it on the open and close of one panel - but leaving it open and opening another panel has me stumped.... View the...

AngularJS double ng-repeat

javascript,jquery,angularjs,angularjs-ng-repeat,jquery-accordion
I'm working on accordion group and have two ng-repeat. Outer one repeats weeks from current week to a specific date. Inner repeats working hours sever days in each week. function expand(week.id) is to call database and prepare data for variable "hour". My problem is that when I click on one...

Close Accordion on mouseLeave

jquery,html,css,jquery-accordion,mouseleave
Hello and happy sunday! A client of mine requested this accordion for their website to display their different basketball academy membership offerings. They like everything about it, except the fact that it doesn't close when you take the mouse away from it. I found the code for this accordion online...

jQuery multiple dynamically created slide down DIV's all open at once

php,jquery,dynamic,jquery-accordion,slidedown
I have some slide down boxes that are being created dynamically as shown in the PHP snippet below. At the moment when you click the title to drop down it opens every div as you can see in the fiddle below. How do I add the variable from PHP and...

Jquery Accordion with Font Awesome Toggle

javascript,jquery,font-awesome,jquery-accordion
I've been looking through the boards, and haven't found a solution to help with my issue at hand. I have an accordion feature that features font-awesome. I want to be able to toggle between the font awesome classes fa-angle-up/fa-angle-down when the accordion button is clicked. This is simple enough, but...

Custom jQuery accordion - scroll to top of the active panel

jquery,scrolltop,jquery-accordion
I have an issue with a custom jQuery accordion. I cannot use the accordion in jQuery UI, therefore I'm stuck with the custom solution. I created a fiddle here: https://jsfiddle.net/1x11ceev/9/ My jQuery: var allPanels = $('#accordion > .acc-item > .container > .content-text').hide(); $('#accordion > .acc-item').click(function() { if ($(this).hasClass('active')) { allPanels.slideUp();...