Index | OAT homepage | OpenLink Software

# OATDOCsimplefx

- OATDOCsimplefx
- _ _ simplefx.js
- _ _ _ _ Functions
- _ _ _ _ _ _ OAT.SimpleFX.shadow(element, options)
- _ _ _ _ _ _ OAT.SimpleFX.roundImg(element, options)
- _ _ _ _ _ _ OAT.SimpleFX.roundDiv(element, optionsObject)
- _ _ _ _ _ _ OAT.SimpleFX.shader(clicker, target, options)
- _ _ _ _ Examples
- _ _ _ _ _ _ Example 1, using OAT.SimpleFX.roundImg
- _ _ _ _ _ _ Example 2, using OAT.SimpleFX.roundDiv

## simplefx.js

Simple eyecandy effects: shadows, rounding etc.

### Functions

#### OAT.SimpleFX.shadow(element, options)

Adds a shadow to `element` . Available `options` are:

- `imagePath` - path to directory with shadow images
- `offsetX` , `offsetY` - horizontal and vertical offset
- `rightSize` , `bottomSize` - dimensions of shadows
- `rightImage` , `bottomImage` , `cornerImage` - file names

#### OAT.SimpleFX.roundImg(element, options)

ToBeDone
- Verify `OAT.SimpleFX.roundDiv` vs `OAT.SimpleFX.roundImg` - original documentation had this section header as `roundImg` -- but sample code was `roundDiv`
Creates rounded corners on `element` , using images. Available `options` are:

- `corners` - array of booleans, specifying corners to be rounded. Starting from left top clockwise.
- `edges` - array of booleans, specifying edges to be rounded. Starting from top clockwise.
- `cornerFiles` , `edgeFiles` - array of file names
- `thickness` - array of sizes, specifying thicknesses of corners. Starting from left top clockwise.

#### OAT.SimpleFX.roundDiv(element, optionsObject)

ToBeDone
- Verify `OAT.SimpleFX.roundDiv` vs `OAT.SimpleFX.roundImg` - original documentation had this section header as `roundImg` -- but sample code was `roundDiv`
Creates rounded corners on `element` , using stacked DIVs. Available `options` are:

- `corners` - array of booleans, specifying `corners` to be rounded, clockwise from top left.
- `color` , `backgroundColor` - colors to be used. BackgroundColor is used only for computation of antialiasing color. Defaults to ' `auto` ' (inherit).
- `antialias` - boolean value
- `size` - radius. Good values are `2-8` .

#### OAT.SimpleFX.shader(clicker, target, options)

Marks `clicker` as a button, which hides/shows `target` . `Target` may be an array of elements. Available `options` are:

- `type` - (toggle)
- `0` - only hide
- `1` - only show
- `2` - both

### Examples

#### Example 1, using OAT.SimpleFX.roundImg

ToBeDone
- Verify `OAT.SimpleFX.roundImg` vs `OAT.SimpleFX.roundDiv` - original code had `roundDiv` , but description was `roundImg`

    OAT.SimpleFX.shadow("myDiv", {});
    OAT.SimpleFX.roundImg("myDiv",{corners:[1,1,0,0]});
    OAT.SimpleFX.shader("myDiv", ["myDiv1","myDiv2"], {type:2});

#### Example 2, using OAT.SimpleFX.roundDiv

ToBeDone
- Verify `OAT.SimpleFX.roundImg` vs `OAT.SimpleFX.roundDiv` - original code had `roundDiv` , but description was `roundImg`

    OAT.SimpleFX.shadow("myDiv", {});
    OAT.SimpleFX.roundDiv("myDiv", {antialias:1, size:5});
    OAT.SimpleFX.shader("myDiv", ["myDiv1","myDiv2"], {type:2});

Copyright (C) 2005-2008 OpenLink Software