DHTML Lab: Accessing the User-Defined System Colors, Part I - dhtmlab.com | 6 | WebReference

DHTML Lab: Accessing the User-Defined System Colors, Part I - dhtmlab.com | 6

Logo

Accessing the User-Defined System Colors, Part I
IE4Win32


To assist non IE4Win32 readers in properly following the discussion, we will use screenshots of the dialog elements until the final page, when the dialogs will be live once again. The color scheme followed in the screenshots is the Windows Standard.

The Dialog Bodies

First we create two positioned elements. We will call them popup1 and popup2.
<DIV ID=popup1
STYLE="position:absolute;
       visibility:hidden;
       left:240;top:300;
       width:212px;height:180px;
       border:2px threedhighlight outset;
       background-color:threedface;
       font-family:MS Sans Serif;font-size:8pt;
       cursor:default"
onSelectStart="return false"
onMouseDown="makeActive(this)">
</DIV>

<DIV ID=popup2
STYLE="position:absolute;
       visibility:hidden;
       left:440;top:360;
       width:212px;height:80px;
       border:2px threedhighlight outset;
       background-color:threedface;
       font-family:MS Sans Serif;font-size:8pt;
       cursor:default"
onSelectStart="return false"
onMouseDown="makeActive(this)">
</DIV>

Notice:

  1. the element background color is set to threedface, the "body" color of 3D objects.
  2. The border color is threedhighlight. Explorer will render the shadow colors automatically when creating an outset border.
  3. the element font-family is MS Sans Serif, the default Windows screen font. This choice adds to the application look.
  4. the cursor is set to default (the arrow pointer). We do not want an insert cursor appearing when over text. Another application feature.
  5. the onSelectStart event handler is assigned a false return. This disables text highlighting within the dialog. Yet another application feature.

We also assign the makeActive() function to the onMouseDown handler. We'll look at the function later. For now, we need to know that whenever a user mouses down on a dialog element, a function is called which makes it the active element.

Now, let's populate the dialog elements.



Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: Feb 23, 1999
Revised: Feb 23, 1999

URL: http://www.webreference.com/dhtml/column24/colsIEexample2.html