PacktLib: Learning the Yahoo! User Interface library

Learning the Yahoo! User Interface Library


About the Author


Introducing the YUI

What is the YUI?

What Comes with the YUI?

Installing the YUI

Using the Library Files in Your Own Web Pages

Code Placement

Perfect Date Selection with the Calendar Control

Implementing a Calendar


Creating Consistency With The CSS Tools

Tools of the Trade

Element Normalisation with reset.css

First Base

Tidying up Text with fonts.css

Layout Pages with Ease Using grids.css

A Word on Sam


DOM Manipulation and Event Handling

Working with the DOM

Common DOM Scripting Techniques

DOM Manipulation in YUI

Listening for Events the Easy (YUI) Way

Event Models

YUI Event Capturing

A Look at the Event Class

Custom Events

Creating a Custom Event


AJAX and Connection Manager

The Connection Manager—A Special Introduction

The XMLHttpRequest Object Interface

A Closer Look at the Response Object

Managing the Response with a Callback Object

Working with responseXML

Useful Connection Methods

A Login System Fronted by YUI


Animation and the Browser History Manager

Introducing the Animation Utility

Using Animation to Create an Accordion Widget

Restoring the Browser's Expected Functionality

Using BHM


Buttons and Trees

Why Use the YUI Button Family?

Meet the Button Control

Using the Button Control

Using the Split Button Type

Tree-like Structures with the TreeView Control

Class of Nine

Implementing a Tree


Navigation and AutoComplete

Common Navigation Structures

Instant Menus—Just Add Water (or a Menu Control)

The Menu Classes

Creating a Basic Navigation Menu

Using the ContextMenu

The Application-style MenuBar

Look Ahead with the AutoComplete Control

Implementing AutoComplete

Working With Other DataSources


Content Containers and Tabs

Meet the YUI Container Family

Creating a Panel

Working with Dialogs

A Quick SimpleDialog

Easy Tooltips

The YUI TabView Control

Adding Tabs


Drag-and-Drop with the YUI

Dynamic Drag-and-Drop without the Hassle

The Different Components of Drag-and-Drop

DragDrop Classes

Implementing Drag-and-Drop

Visual Selection with the Slider Control

A Very Simple Slider


Advanced Debugging with Logger

The Purpose of Logger

The Purpose of the —debug Library Files

How the Logger Can Help You

The Logger Classes

How to Use Logger

Component Debugging with Logger

Logging with a Custom Class