$("#x-btn-widgetbar").click() no longer expands top widget area

This javascript used to work, but now the widget area stays closed.

I can see it flashing a bit, but the widget area doesn’t expand anymore. Page with problem is at http://solar-invictus.com/saving-money-with-solar-energy/

Hi @ASK,

Thanks for reaching out!

The button widget area on the top right is just working fine on my end. I suspect that this is just a cache on your end. I suggest that you clear any 3rd party cache associated with your website and also clear your browser cache. Please see the secure note of the test I made on your website.

Hope that helps.

Thank you.

Sorry I wasn’t more clear. The widget area works fine when you click its expansion button at the top right. I also have a big red button near the bottom of the screen that uses javascript to expand the same area. It no longer works, and it’s definitely not a caching issue.

Hi @ASK,

Would you mind sharing a screenshot pointing to what big red button you are referring to? Please keep in mind that customization or enhancing custom code is outside the scope of our theme support. We just want to know if our theme is causing the issue.

Thank you.

It fades into view if you scroll down to the bottom. The same kind of problem exists on the Contact page.

Hi @ASK,

Sorry for the confusion, since it involves some customization, enhancing your JS code is outside the scope of our theme support. You may seek 3rd party developers to help you with your problems or you can avail One where we can answer questions outside of the features of our theme.

Thank you for understanding.

It’s the same javascript you supplied to others in the past! Such as Activate widget-bar from search button and https://theme.co/archive/forums/topic/use-button-to-open-widgetbar/ and https://theme.co/archive/forums/topic/use-button-to-open-widgetbar/

Anyway, this is a very simple js customization that should just work. But for some reason, calling the .click() method simply doesn’t work anymore. Something might have changed in the theme’s codebase to cause this, so I suggest you look into it further. The site was working fine for years and only became dysfunctional after the theme was updated.

Hello @ASK,

The JS code no longer works could be because of the WordPress updated jQuery version. The click() method may have been deprecated on the latest release. I have checked the page and I am seeing a JS error:

[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See <URL>

There is a difference between the button elements used in the old thread and your button. I would recommend that you use a static button instead of a CTA button so that your old code will still work.

Kindly let us know how it goes.

That JS error is actually due to X-Smooth-Scroll; it goes away when that plugin is disabled. But disabling that plugin doesn’t fix anything.

The only way to fix this is to change the selector function to vanilla document.querySelector() instead of jQuery() or $().

But it would benefit all of us to know why this stopped working!

Hi @ASK,

As my colleague said the WordPress core updated the jQuery version and that’s one of the reason why your old code didn’t work anymore with the latest version of WordPress.

Hope that helps.

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.