Chapter 10. jQuery UI mouse interactions: Follow that mouse!
This chapter covers
- Core mouse interactions
- Implementing drag and drop
- Making things sortable
- Allowing resizing
- Making things selectable
Few usability experts would argue that direct manipulation isn’t key to good user interfaces. Allowing users to directly interact with elements and immediately see the effects of their activities is a much better user experience than some abstraction that approximates the activities.
Take sorting a list of elements for example. How would we allow users to specify a sort order for the elements? Using just the basic set of controls available in HTML 4, there’s not a whole lot of flexibility available to us. Showing the list of elements followed by a text box next to them in which the user must type the ordinal value could hardly be presented as a paragon of usability.
But what if we could allow users to grab and drag the elements within the list to immediately move them around until they’re happy with the result? This mechanism, using direct manipulation, is clearly the superior approach, but it’s out of reach given only HTML’s basic set of controls.
The core interactions—focusing on direct manipulation—are the foundation upon which jQuery UI is built, and they afford us a much greater degree of power and flexibility with regard to the types of user interfaces that we can present to our users.