view in github

Example for the selectBoxUI library

Get to the sides of the images (or the corners) and grab them to change the selectbox user interface.

(*) the library just adds the user interface for select-like operations over images (or any object)

Simple example

hint: add the data-selectboxui attribute, and we use data-selectboxui-initial-box to add an initial select box

Example of multiple elements (one declarative and the other programmatically)

the first image adds the data-selectboxui attribute, but the second is created programmatically

Example of an arbitraty object (e.g. a form)

The library should be able to add the SelectBox user interface to any object in the DOM. In this case we have removed the central part (i.e. the focus part) using the data-selectboxui-no-focus

Example of a iframe

This is a more complex example in which we create the selectBoxUI using the declarative method (i.e. adding the data-selectboxui attribute), and later we can read the selectBoxUI attribute from the element to apply methods or to get the position of the box.