Is there any way to set a background color for the HTML <area>
element? I'm creating an image map where certain sections of the map will pop up a tooltip when you mouse over them, and I thought it would be cool (and convenient) if I could set a background color for the <area>
elements so you could see where they were located over the image.
I've tried both background-color and border, and neither have any effect - the <area>
elements remain "invisible." I'm assuming this is because <area>
is a self-closing tag and so it doesn't actually have any dimensions? But forcing a height and width didn't help, either.
The attribute that is used to set background color of an HTML element is bg color. Depending on the element whose background color is to be set, we use the appropriate tag. The bgcolor attribute can be used with the following tags- body, table, td, th, tr, marquee.
The background-color CSS property sets the background color of an element.
Background-color values can be expressed in hexadecimal values such as #FFFFFF, #000000, and #FF0000. Background-color values can be expressed using rgb such as rgb(255,255,255), rgb(0,0,0), and rgb(255,0,0).
You can specify colors on page level using <body> tag or you can set colors for individual tags using bgcolor attribute. bgcolor − sets a color for the background of the page. text − sets a color for the body text.
It doesn't seem possible.
You might want to look into this jQuery plugin:
http://plugins.jquery.com/project/maphilight
Here's an example:
http://davidlynch.org/js/maphilight/docs/demo_usa.html#
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With