Chapter 14. Dynamic User Interfaces with jQuery

Over the past several chapters, we have built the complete Optilux Cinemas website. All the features outlined in Chapter 2, Introduction to the Case Study, have been delivered, and the site works well in all major browsers. However, our custom user interface elements are not terribly exciting, and we rely on full-page reloads everywhere.

In this chapter, we will consider how to make our user interface more dynamic. We will cover:

• The roles of Kinetic Style Sheets (KSS) and jQuery in Plone 4
• Installing and managing JavaScript resources
• Using Plone 4's new overlay effect
• Manipulating page structure and submitting background requests in JavaScript

KSS and jQuery in Plone 4

Plone 3 introduced a new JavaScript framework called KSS, which stands for Kinetic Style Sheets. KSS is based on the premise of a CSS-like 'style sheet' that defines behaviors by linking page elements to one or more client- or server-side plugins.

KSS still...