Having some trouble with something hoping someone may be able to help out.
Below is a link for tabs, and accordion (both work perfect separately)
Tabs
jsfiddle.net/31oftamq/6/
Accordion
jsfiddle.net/xLh6k5fm/2/
When I put the accordion in the content area for one of the tabs, the accordion does not appear whatsoever when I run it.
Anyone know what the issue could be? Help will be much appreciated.
Thank you! :)
Because you hide it with this:
$('.tabs-stage div').hide();
Change it to:
$('.tabs-stage div[id^=tab]').hide();
Check full code here: http://jsfiddle.net/31oftamq/9/
Related
I am dealing with a strange problem.
I want to use a tabular menu inside the accordion.
Now the problem is that somehow the html gets scrambled inside the accordion.
I have made a fiddle to demonstrate this problem:
jsfiddle
is just do a standard:
$(document).ready(function() {
var accordion = $('.ui.accordion');
$(accordion).accordion();
$('.tabular.menu .item').tab();
})
The problem occurs when you toggle the first tab or open any other tab.
On first initialization there is nothing wrong en everything works fine.
I hope anyone can help me out with this
Thanks for your help guys, really appreciate it!
The fix is given on the github repo
$('.ui.accordion').accordion({
animateChildren: false
})
I'm sure this issue is the result of conflicting code, but I cant seem to find it. I've removed all of the page except for the menu bar area. I'd would appreciate any help in getting the drop down to appear. It may be better to just recreate the top portion of the page at this point, but I thought I would check here first in case its just an oversight.
Thanks in advance.
<https://jsfiddle.net/cxLap188/#&togetherjs=GqBl9GC4UQ>
In that jsfiddle you have 2 div with id="bs-example-navbar-collapse-1", so the navbar-toggle works with the first it finds, just delete the one you dont need (the one after that <h3 class="hedLogo"> I guess).
I am having an issue with foundation 4 section tabs. I copy pasted the example code to my local and tested it and it doesnt show up.
I also modified it and added some height elements to make it display properly but still I can only view on tab and clicking it doesnt actually open up the content.
I have included jquery foundation.css and foundation.min.js and also zepto.js without any luck.
If anyone could tell me what i might be doing wrong or if there is an issue with the framework that would be great.
Thanks.
Please close this.
I fixed the problem by adding a foundation at document load. :)
Cheers hope this helps someone in need.
$(document).foundation(); Thats the code I added right at the start of document.ready.
Here's a crude sample of what I'm dealing with: http://jsfiddle.net/dX2ux/1/
A client's in-house developed CMS dynamically creates menus using this HTML structure. It also comes with the jQuery script that is shown on the sample.
I want to edit the script so that it closes it's sibling's open menus before it toggles itself open. The show class is has to be toggled as well.
So far, I've come up with this: http://jsfiddle.net/dX2ux/2/
But if you play with it, it screws up when you click one of the sub menus.
Can anyone shed some light on how I might achieve the behavior I'm aiming for? Also, is this the best way to do it? Am I overthinking this?
Any help is appreciated. Thank you.
Not really sure if this is the "best" way per se, but with that kind of markup, this solution should work:
$('.toggle-menu').on('click',function(e){
e.preventDefault();
$(this).parent().siblings().children('.toggle-menu').removeClass('show').next().slideUp();
$(this).toggleClass('show').next().slideToggle();
});
Edited your fiddle to show the effect: http://jsfiddle.net/dX2ux/3/
I'm using a zencart with a css flyout header menu and I also want use the jquery slider widget as one of the options in this menu but when I put it in there the little sliders don't appear correctly, it's like they've collapsed.
I've put together a fiddle which although it has all the code doesn't seem to be working, it's hopefully something stupid I'm not doing coz all the code is there as far as I can see.
can anyone help me out please
http://jsfiddle.net/4VU8D/
EDIT: here's a slightly better but still not working fiddle
You've only included the jQuery Framework, but not the jQuery UI.