Member Avatar for joeyliew7

this is the function

<SCRIPT TYPE="Text/JavaScript">
<!-- Beginning of JavaScript -

function changecolor(code) {

document.bgColor=code
}
// - End of JavaScript - -->
</SCRIPT>

this is the code

<a href="" onmouseover="document.bgColor='turquoise'">C</a>
<a href="" onmouseover="document.bgColor='pink'">h</a>
<a href="" onmouseover="document.bgColor='blue'">o</a>
<a href="" onmouseover="document.bgColor='red'">o</a>
<a href="" onmouseover="document.bgColor='yellow'">s</a>
<a href="" onmouseover="document.bgColor='green'">e</a>
<a href="" onmouseover="document.bgColor='white'">your</a> 
<a href="" onmouseover="document.bgColor='greem'">o</a>
<a href="" onmouseover="document.bgColor='seagreen'">w</a>
<a href="" onmouseover="document.bgColor='magenta'">n</a>
<a href="" onmouseover="document.bgColor='fusia'">b</a>
<a href="" onmouseover="document.bgColor='purple'">a</a>
<a href="" onmouseover="document.bgColor='navy'">c</a>
<a href="" onmouseover="document.bgColor='royalblue'">k</a>
<a href="" onmouseover="document.bgColor='Skyblue'">g</a>
<a href="" onmouseover="document.bgColor='brown'">r</a>
<a href="" onmouseover="document.bgColor='almond'">o</a>
<a href="" onmouseover="document.bgColor='coral'">u</a>
<a href="" onmouseover="document.bgColor='olivedrab'">n</a>
<a href="" onmouseover="document.bgColor='teal'">d</a>
<a href="" onmouseover="document.bgColor='black'">color!</a>

i want to change background color of the page. used this codes but it dont work. i dont know where go wrong. pls help.

  • 3 Contributors
  • 3 Replies
  • 279 Views
  • 17 Hours Discussion Span
  • Latest Post Latest Post by joeyliew7

Dani AI

Generated

As showed, the page uses inline handlers and the legacy document.bgColor, and pointed in the right direction. The most likely reasons the background "does nothing" are: several color names are misspelled (browsers ignore unknown names), an empty href="" can trigger navigation or focus oddities, the old document.bgColor is deprecated and can be overridden by CSS on html, and the site might be setting a background on the html element so changing body has no visible effect. Thanks also to for the reference link.

Quick checklist to diagnose:

  • Open DevTools and run a quick assignment in the console to test (try a valid hex like #ff0000). If that changes color, the problem is event wiring or typos.
  • Inspect computed styles on html and body to see which element holds the background.
  • Fix misspelled names (e.g. use fuchsia, not fusia) or use hex/rgb values for reliability.
  • Avoid href=""; either prevent default on click or use buttons for interactive controls.

A small, unobtrusive approach (use data attributes + a single listener) avoids inline handlers and works even when html is styled:

<!-- give each trigger a data-color attribute -->
<a data-color="#89CFF0" role="button" tabindex="0">C</a>
document.addEventListener('mouseover', function(e) {
  var el = e.target.closest('a[data-color]');
  if (!el) return;
  var color = el.getAttribute('data-color');
  document.documentElement.style.background = color; // covers html + body styling
});

Final notes: prefer keyboard-accessible triggers (buttons or tabindex + key handling), do not rely on color alone to convey meaning, and validate color names with a quick console test if a hover seems to "do nothing."

Recommended Answers

All 3 Replies

Member Avatar for JorgeM

Since you are declaring a function in your script, you need to call that function and sending the color value.

onmouseover="changecolor('blue')"

Then in the function

document.body.style.backgroundColor=code;

Since you are using anchor elements, you may want to remove the page loading function of the link in case the user clicks on it.

<a href="javascript: void(0)">I am not clickable</a>

Member Avatar for joeyliew7

Thank u JorgeM for the help.. =)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.