Focal Point
CSS guru: how do i change color of ddbox arrow

This topic can be found at:
http://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/3401077331

January 19, 2004, 04:47 PM
susannah
CSS guru: how do i change color of ddbox arrow
Could one of you css gurus tell me the css syntax for addressing the arrows in a dropdown box? and the arrow's background?
thanks
January 20, 2004, 08:08 AM
<Grzegorz>
For the standard shapes of the DHTML cursor (and some CSS sytax for setting the cursor shape), you can look here:
http://www.w3schools.com/css/tryit.asp?filename=trycss_cursor

Changing background of the cursor is not so easy. One of the way (at least available in IE 6) is to use the "nonstandard" cursor. The syntax:

style="cursor: url('../new_cursor.cur')"
You cannot use any "normal" graphic format like *.jpg, *.gif, *.png for the customized cursor. You have to use one of the "special cursor" formats: *.cur or *.ani.

You can also try to experiment with the standard shapes of the cursor, and another DHTML layer for changing the background. Something like the following example


<script type="text/javascript">
function popupMove(popup) {
var bkg = document.getElementById("cursorBackground");
popup.style.cursor = 'wait';
bkg.style.cursor = 'wait';
bkg.style.visibility = "";
bkg.style.background = "Red";
bkg.style.top = event.clientY - 8;
bkg.style.left = event.clientX - 8;
}
function popupOut(popup) {
popup.style.cursor = "normal";
document.getElementById("cursorBackground").style.visibility = "hidden";
}



style="position: absolute; z-index: 0; width: 200px; height: 200px;"
onmousemove="popupMove(this)" onmouseout="popupOut(this)">

style="z-index:10; position:absolute; height:16px; width:16px;">



Hope this helps
Grzegorz

This message has been edited. Last edited by: <Mabel>,
January 20, 2004, 12:44 PM
susannah
thanks grzegorz, for your very kind reply; but its not the cursor i'm seeking to change. its the arrow and arrowbg in the dropdown box.
January 20, 2004, 01:48 PM
<Grzegorz>
Sorry, I did not read carefully.

Unfortunately, I do not think it is easy (if possible) to change the arrow color for the select tag (drop-down list). Below is the link to the discussion on the other forum:

http://www.webmasterworld.com/forum83/1100.htm

and citation (from another forum):
it is impossible to change the color of the arrow in a select box. this color is set by the "desktop theme" of your windows desktop.

I can think about replacing drop-down list with any scrolled iframe and the button, but it is a lot of work and it is rather doubtful if the effect is worth of the effort.

Regards
Grzegorz
January 20, 2004, 02:27 PM
susannah
thanks for the ref. you're so kind. I'll keep looking.
btw, that webmasterworld forum looks great. i joined.