Form Styles

With CodeThatForm you can specify various window properties:

Window width and height

Window x/y coordinates

Window title

HTML-code inside the window

Background color, background image, CSS

Images for window buttons - minimize, maximize, restore and close

Window borders

whether window is scrollable and resizeable

The other filters (for MSIE only)

You set initial property values at the time you create form object.

Then you can change some of this properties by using special CodeThatForm methods:

.HTML(html) - change HTML code inside the form. You should set 'html' variable from the beginning

.bgColor(color) - change background color

.bgImage(image) - change background image

.CSS(css) - change CSS style

.Title(title) - change window title

.appHTML(html) - add addition HTML-code to an existent

After you create form object you might use the structure like this:

<form>
<input type=button onclick="wincreate()" value="Create box"><br>
<input type=button onclick="w.bgColor('#AACCAA')" value="Set color"><br>
<input type=button onclick="w.Title('Another title')" value="Set title"><br>
<input type=button onclick="w.appHTML('Copyright?<br>')" value="Add HTML"><br>
</form>

Example - Change Form Properties

You can see an example and complete code here - Change Properties for Layered Form

Change Properties for Simple Window

Also you can use advanced properties:

.Caption(cpt) - change window caption properties.
'cpt' - special object that describes window caption

cpt { bgc : color, // caption color h : int, // caption height bgi : url, // caption background image css : class // caption css class }

Advanced Borders - set images for layer borders

brd { color : string, // border color width : integer, // border width bgimg : url, // border background image // you can specify all the borders separately // (can be omitted) t : // top border { color : string, // border color width : integer, // border width bgimg : url, // border background image }, b : // bottom border { ... }, l : // left border { ... }, r : // right border { ... } }

Example - Layered Form with Original Borders

You can see an example and complete code here - Layered Form with Original Borders

Read more about CodeThatForm >>