:: Documentation >>

Mouseover effects

Mouseover effects for a single cell can be done similar to the row highlighting with the help of two global functions (see /lib/system/html.js):

function mouseover(element, name){...}
function mouseout(element, name){...}

The first one adds a CSS class selector 'name' to the HTML element, the second removes it.

To create mouseover effect you have to define a CSS class:

<style>
    .active-cell-highlight {background-color: green!important}
</style>

and add the following script

var column = new Active.Templates.Text;
column.setEvent("onmouseover", "mouseover(this, 'active-cell-highlight')");
column.setEvent("onmouseout", "mouseout(this, 'active-cell-highlight')");
obj.setColumnTemplate(column);

You can combine both row and cell highlighting:

See also

Highlight row on mouseover

Comments

How can I show a cell's full data in a mouseover popup? Lazzab (6)
Mouserover does not work in grid 2 Ksheer (4)
mouseover effect on selected rows Diogo Zulli (diogo ATT gn DOTT com DOTT no-spam br) (3)
How can I just use setEvent to the column 2 ? Kevin (1)
Row & Cell highlighting (2)
Tweek the column header row style Jeremie (4)

Documentation:

Recent changes:

2.6.4
2.6.3
2.6.2
2.6.1
2.6.1
2.6.0
2.5.0 - 2.5.6
2.5.6
2.5.0 - 2.5.5
2.5.5