ARTICLE AD BOX
Lately, I've been remaking my website, and although I do have a functioning menu system that allows me to make changes through all pages by just changing the .js file, if I ever want to use different menu colors, I have to create its own .js for the colors I want (e.g: menugreen.js, menupink.js and so on), and I was wondering if there was any way to make so instead of having multiple .js files, I could just automize everything with JavaScript and just have it automatically change depending on the page if a certain tag or id was found
Something like if the id bluemenu is detected in the HTML (<div id='bluemenu'>) it changes the background-image element for the navigation bars.
Here's what I've got on my menugreen.js file
let MenuContent = ` <div class='navigationcontainer' style='margin-top:10px;'> <img src='./images/menus/navigationbargreen.png'> <a href='https://rootpain.com/index.html'> <div class='buttoncontainer'> <img src='./images/menus/homebuttonfaded.png' class='buttonfade'> <img src='./images/menus/homebutton.png' class='button'> <img src='./images/menus/homebuttonslide.png' class='buttonslide'> </div> <img src='./images/menus/menuhandlebargreen.png'> </div> `;An example on how the menus look in the website itself
And is it possible to achieve this without JQuery?
