Issues with Accordions and Tabs

[jwalker]

Greetings,

I’ve been working on a website for a nice time now, and have heavily relied on tabs and accordions to display information that was once spread across multiple pages on one page. However, I have been unable to get the accordions and tabs to open via browsers. If I open them via the cornerstone editor - it works perfectly fine, I can see content and open and close it with no issues, however, if I view the page from the frontend, It allows me to click a tab, but it won’t actually expand and show the content.

Since the issue started in the last day, I have:

Disabled plugins that have been installed recently
Updated cornerstone’s software
Disabled caching plugin
Cleared browser’s cache
Used separate browser to view page
None of these options have proven successful for me, and this site is slated to launch in the next 2 days.

Any help would be greatly appreciated.

I do have a similar post in the Peer to Peer forum, and I have tried the given solution to no avail.

Website URL: http://thisislivingstone.com

• Almost every one of the primary menu pages (except those with submenus) employ tabs, accordions or both

[Joao]

Hi There,

I Can see script errors on all your pages, Did you insert any JS code? If yes try removing it.

If the issue persists, please provide your admin credentials in a secure note so we can take a closer look.

Thanks

[jwalker]

Thank You @Joao!

I have added a secure note per your request.

[rad]

Hi there,

Looks like due to one or multiple plugins, when I deactivated all your plugin except cornerstone, the accordion starts working again. Please deactivate all your plugin and test it again just to confirm it on your end. Then activate them one by one until the issue appears, and then the last plugin that you activate will be the culprit once the issue reappears.

Thanks!

[jwalker]

@Rad i went ahead and disabled the plugins and found the one that caused them not to open, however, now they open for a half of a second, and then they close. Once they close, you can no longer open them. No idea why.

[christopher]

Hi there,

Would you please give us the URL of the page that you have problems in? I checked the page below and the tabs are working with no problem:

http://thisislivingstone.com/admissions/

But one thing that I see is that the website is a little bit slow so you will need to make sure that the site is loaded completely before trying to click on the tab items.

Thank you.

[jwalker]

Thank You for looking into it @christopher.amirian

I have included a google drive link to a video of me demonstrating the issue on various pages. The issue occurs only with accordions, the tabs seem to work fine.

Pages.mov (video)

[rad]

Hi there,

It’s because of this custom javascript,

jQuery(document).ready(function($){	
$('.x-accordion-heading').on('click touchend',function(e) {
	e.preventDefault();
	var el = jQuery(this);
	var body = el.next();
	body.toggleClass('in')
});
});

Please remove it

Thanks!

[jwalker]

Awesome @Rad

I tried it and it worked. That custom javascript was given to me via the peer to peer forums on here - see screenshot:

As soon as I removed it, it worked perfectly. I think the juxtaposition of scripts - radio plugin that was causing issues, and that custom script was to blame.

Thank you so much!

[Joao]

Glad to hear,

Cheers!