Buttons using ID/Class not working on Side Menu

[JfantasyBooks]

Site: http://fantasy-books.live
Wordpress: 4.8
X-Pro: 1.1.0

Problem:

Hello, so I have a function that turns the site on dark mode and light mode on the side menu of the site. The side menu only shows up for posts and on Desktop.

Anyway, the buttons don’t work on side menus. For links, yes, but I have a javascript where I just need to put the ID for the button and it triggers the function.

The javascript works for the top menu or anywhere on the site but the side menu. There is even a working version on the site for the top menu on a post (only visible for mobile/tab platforms or when you zoom in).

Can you help?

Thank you

[ruenel]

Hello There,

Thanks for writing in! To resolve your issue, you will need to update your JS code and make use of this code instead:

(function($) {
	$('#Mode-anchor-button-anchor-button').on('click touchend', function(){
	enableNightmode();
	});
	$('#ModeOff-anchor-button-anchor-button').on('click touchend', function(){
		disableNightmode();
	});
})(jQuery);

Please let us know how it goes.

[JfantasyBooks]

Thank You.

From this, I realized here that the light/dark buttons on the top menu wouldn’t work when I did this, even though the ID was the same. I had to place two different JQuery functions, one setting the ID as one thing, and the other setting the ID as another, else, only one would work per page.

Ex. Sun on top menu, ID = ModeOff, Sun on side menu, ID = ModeOff-anchor…etc.
Same for Moon.

[rad]

Hi there,

Yes, you could only use one ID at a time, they are unique, else, it would trigger javascript error.

Thanks!

[JfantasyBooks]

Noted. Thanks

[nabeel]

Glad we could help.

Cheers!