Menu icon Foundation
Deep-linking Responsive Accordion Tabs, fixed?

An issue with deep-linking Responsive Accordion Tabs was discussed here:

https://github.com/zurb/foundation-sites/issues/9494

Was this issue fixed for ZURB Foundation 6.4.3? We're using ZURB Foundation 6.4.3 and when we attempt to use the deep-linking attributes with the Responsive Accordion Tabs, the accordions stop working after we've switched between tabs and accordions a couple of times by resizing the browser window.

We could be doing something wrong, but I'd like to find out if this has been fixed before we spend any more time experimenting with this.

Thank you.

Jim

Deep-linkingreponsive accordion tabs

An issue with deep-linking Responsive Accordion Tabs was discussed here:

https://github.com/zurb/foundation-sites/issues/9494

Was this issue fixed for ZURB Foundation 6.4.3? We're using ZURB Foundation 6.4.3 and when we attempt to use the deep-linking attributes with the Responsive Accordion Tabs, the accordions stop working after we've switched between tabs and accordions a couple of times by resizing the browser window.

We could be doing something wrong, but I'd like to find out if this has been fixed before we spend any more time experimenting with this.

Thank you.

Jim

James Watkin almost 2 years ago

I did some more tests with a clean version of the ZURB template. I was able to reproduce the issue. If I don't use the deep-link attributes, the responsive accordion tabs seems to work fine. I've added a comment with my details to this existing closed issue:

https://github.com/zurb/foundation-sites/issues/9494

Can anyone confirm this as a ZURB Foundation 6.4.3 bug, or if I have the configuration wrong?

Thank you.

Jim

James Watkin almost 2 years ago

Thank you Chris!

Based on your post, I think I might have narrowed it down even further to just the "smudge" attributes. The "data-update-history="true" attribute seems to work for me, but either or both "smudge" attributes causes the problem.

Thank you again.

Jim 

 

James Watkin almost 2 years ago

Chris,

After posting my previous comment and editing it, I see that your solution comment is missing. I didn't delete it, and I doubt if it's even possible for me to have deleted it.

?

Jim  

Chris Davis almost 2 years ago

Reposting my previous comments from yesterday just for continuity sake...

 

I was getting a very similar error to the one you reported in GitHub but after playing around a bit the error reported in the console now looks like this...


(firewall won't let me upload screen-shot so copy/pasting console error)


foundation.min.js:3 
TypeError: url.indexOf is not a function
    at jQuery.fn.init.jQuery.fn.load (jquery.js:9823)
    at e._checkDeepLink (foundation.min.js:1)
    at e.value (foundation.min.js:1)
    at e.value (foundation.min.js:1)
    at e.t (foundation.min.js:1)
    at new e (foundation.min.js:1)
    at e.value (foundation.min.js:4)
    at e.value (foundation.min.js:4)
    at e.value (foundation.min.js:4)
    at e.t (foundation.min.js:1)
(anonymous) @ foundation.min.js:3
each @ jquery.js:362
each @ jquery.js:157
(anonymous) @ foundation.min.js:3
each @ jquery.js:362
reflow @ foundation.min.js:3
e @ foundation.min.js:3
(anonymous) @ app.js:1


...not only does it cause accordion to cease functioning but it also seems to break my responsive top-bar sticky nav menu. Oddly enough, tabs work fine at desktop viewports. It only seems to happen if I use data-update-history="true" data-deep-link-smudge="true" data-deep-link-smudge-delay="500" --- data-deep-link="true" by itself does not seem to cause any issues

Chris Davis almost 2 years ago

I was able to do a couple of quick tests involving clicking around on tabs/accordions and resizing in-between to try and replicate the error I was experiencing yesterday and it appears that you are correct, the smudge attributes seem to be the culprit in this issue.

I can use "data-deeplink" and "data-update-history" attributes and not get the console errors and breaking behavior I described yesterday.

Just in case anyone wants to research any further, I am on Win10/Chrome62 using Foundation v6.4.1 pre-compiled CSS version (I also confirmed this is an issue using a custom build of v6.4.2, was unable to download v6.4.3 from the zurb website to see if it was fixed in that version as claimed)

James Watkin almost 2 years ago

I received a direct email from Rafi at ZURB about this issue. Regarding deep-linking the "Responsive Accordion Tabs" container, Rafi writes:

"It is a feature of tabs and accordions but not the Accordion-tab plugin."

 

Jim

Chris Davis almost 2 years ago

Hmm... that seems short sighted.