Wikipedia:Reference desk/Archives/Computing/2022 December 17

= December 17 =

Making buttons to change the colors on a page.
I had buttons on a site that changed the bgcolor and text color back and forth between "day time" and "night time." The code just changed the default colors. But now I want to use to as declaring variables, i.e., color1, color2, which can change, upon button click. Here's what I have

 body.theme-day { color1: green; color2: red; color3: lightgray; } body.theme-night { color1: darkgreen; color2: darkred; color3: gray; }

/* hide elements for the opposite theme body.theme-day .theme-night { display: none; } body.theme-night .theme-day { display: none; } */	 function change_theme(theme) { document.body.className = document.body.className.replace(/\s*theme-\S+/, "") + " theme-" + theme; } //And then the buttons. Day version Night version 

And so my issue is, using color1 and color2 are not recognized, say, when I use font color="color1" for example. Thanks. 67.165.185.178 (talk) 16:29, 17 December 2022 (UTC).


 * I'm not used to CSS, but I had a look at the relevant page on W3Schools.
 * Variables: it seems that their names have to start with, so you would have to say  , and so on. Then, it seems that you have refer to them using the var function. So rather than saying   it would be  .  Card Zero  (talk) 22:07, 17 December 2022 (UTC)
 * Okay, I got half of it to work. The part that works is

(Above is all within tags. But the part that doesn't work is,  rather than  ?

Card Zero (talk) 00:49, 18 December 2022 (UTC)
 * Okay, got it to work, it was indeed background-color. 67.165.185.178 (talk) 01:07, 18 December 2022 (UTC).