Learning jQuery 3 - Fifth Edition

Interaction components

The next major feature of the jQuery UI is its interaction components, which are a set of behaviors that can be used to produce complex interactive applications. One such component, for example, is Resizable, which can allow the user to change the size of any element with natural dragging movements.

Applying an interaction to an element is as simple as calling the method that bears its name. For instance, we can make the book titles resizable with a call to .resizable() as follows:

(() => {  $books    .find('.title')    .resizable();});

Listing 7.12

With jQuery UI's CSS file referenced in the document, this code will add a resizing handle to the bottom-right corner of the title box. Dragging this box alters the region's ...