checkableRows example (jQuery)

Example of checkableRows, selectableRows and focusable behavior.

Use mouse, UP, DOWN and SPACE keys.

Allow multiple selection (click with CTRL or SHIFT key).

Product Id	Artist	Album	Year	I like it
001	Beatles	Please Please Me	1963
002	Beatles	A Hard Day's Night	1964
003	Beatles	Yellow Submarine	1969
004	Rolling Stones	December's Children (And Everybody's)	1965
005	Rolling Stones	Beggars Banquet	1968
006	Rolling Stones	Goats Head Soup	1973

Selected product Ids: []

Checked product Ids: []

Log:

If you feel interested, see checkableRows source code and documentation and more examples on a separate page.

Sash/splitter example (javascript)

I created jQuery Sash Plugin. This example demonstrates how it works. Just drag gray bar to left and right.

left panel

right panel

If you feel interested, see source code and documentation and more examples on a separate page.

selectableRows behavior (javascript)

Example of selectableRows behavior on table element. Click within the table to see how it works.

Artist	Album	Year
Beatles	Please Please Me	1963
Beatles	A Hard Day's Night	1964
Beatles	Yellow Submarine	1969
Rolling Stones	December's Children (And Everybody's)	1965
Rolling Stones	Beggars Banquet	1968
Rolling Stones	Goats Head Soup	1973

If you feel interested, have a look at the source code and documentation
See more examples of selectableRows on a separate page.

focusable behavior (javascript)

Below is the simplest example of "focusable" behavior. Three divs have "focusable" class and can get "focused" class from mouse clicks or from keyboard navigation to nested elements.

If you feel interested, have a look at the source code and documentation
See also this example on a separate page.