last day (14 days later) » 

11:25 AM
1
A: How to addClass and removeClass to child element when aria true or false?

Shoaib IqbalA more simpler solution would be to simply toggle the class on click. $(".wf-burger").click(function(){ $('.wf-burger .fa').toggleClass('fa-rotate-90'); }); Updated CSS solution: I have just checked that it uses the open class when dropdown is opened, it is not working on docs, but it is wo...

 
I did think of this solution and while its good for some instances in this case its not because clicking off any other element asides .wf-burger closes the element and that would mean that the toggle would still be active.
 
@SimonHayter I have updated the solution, it looks there is diff between the GitHub files and foundation CDN files. Did you used foundation from GitHub?
 
How do you know that it is version 5.5.3 on the cdn? since there's no versioning on it.
 
search 5.5.3 in the JavaScript source file and you will get it, it is mentioned there.
 
It's odd and confusing which I should be using since both are marked 5.5.3 but have differences.
 
11:25 AM
yes, and the GitHub file has code for active class, see raw.githubusercontent.com/zurb/foundation-sites/v5/js/…
 
Well, what's even more odd is that I've updated the foundation use the same one as you've used in the Codepen and it doesn't add the open, see blackforce.co.uk (click the hamburger on the top left) in source the foundation is listed as foundation.min.js but is the same as that on the codepen..
It looks like an issue being caused by when adding it to the H1, or adding an additional a href within the h1.
Strange, it's the h1 causing the issue see: jsfiddle.net/SimonHayter/h5tk99wr/1
Okay, narrowed it down. It doesn't seem to like any element other than the drop list after the hamburger see: jsfiddle.net/SimonHayter/h5tk99wr/2 any ideas how to fix? or use the aria method instead.
Hey,
I've just solved it. The problem isn't the foundation.js version
 
I saw the dropdown js code and it looks they must be siblings, see

var parent = S(e.target).closest('[' + self.attr_name() + '-content]');
var links = parent.find('a');
 
its the usage of of elements between the drop down
 
yes
:)
 
So what I've done, is removed the h1 and it works fine, with the distribution version of Foundation and the cdn one you gave
it didn't make sense to use the h1 anyhow... since its not really a header, a logo.
 
11:29 AM
as per the code they should be siblings.
 
So, without your answer I wouldn't of solved of it, I'm very grateful and sorry I didn't include the H1 in my example code.
So, I purpose that I add that to my question and then you leave a response saying you have the slibing h1 etc, remove it and use wf-burger.open
Okay?
 
yes, that would help others if they encounter this issue.
 
Awesome! I've just added it. Thanks for all your help and I'll mark your question as accepted after you edited it to make suit for others.
Thanks again! off to make coffee whoa :)
 
You are Welcome.
I just updated the solution.
 

last day (14 days later) »