Bubbling Library > Examples

Plugin Selector - Example - Management your areas (YAHOO-CMS: YAHOO.util.Selector)

This examples show you how to use the selector plugin to highlighting areas within the document when the mouse goes into each area.

As you can see in the source code, this plugin don't need initialization process, only need a simple code to include the area (represented by a className) to the Selector list.
Example: YAHOO.util.Selector.add( 'listing' );

In this case, we use a simple CSS rule to modify the background, and add 15 pixel of left padding to each element in the list.

Here we have a more complex example, using the opacity (40%) as a default status, and when the mouse over the element, the area will become visible (opacity 100%), background gray and border black.

Lastest Releases

YAHOO.util.WizardManager
YUI plugin to management wizard controls. (new)

Hot Components

YAHOO.util.Dispatcher
YUI plugin to management dynamic areas within the document (loading remote contents with scripts tags inside).

Comming Soon

YAHOO.util.Dispatcher
The new dispatcher will support cross-domains capabilities using the most common techniques (both: proxy and iframe). (update comming soon)

Lastest Releases

YAHOO.util.Selector
YUI plugin to highlighting areas within the document when the mouse goes into each area. (new)

 
 

In this case, the only diference is that we use another container to display the same class of elements (selector2), and the four elements are in the same row. As you can see, the selector allow to use the same type for diferent areas, and you can customize each area using the container ID/CLASS.

Example:
#yourcontainer .yourselector.yui-cms-selector .yui-cms-item.selected {}
#othercontainer .yourselector.yui-cms-selector .yui-cms-item.selected {}

Lastest Releases

YAHOO.util.WizardManager
YUI plugin to management wizard controls. (new)

YAHOO.util.Selector
YUI plugin to highlighting areas within the document when the mouse goes into each area. (new)

Hot Components

YAHOO.util.Dispatcher
YUI plugin to management dynamic areas within the document (loading remote contents with scripts tags inside).

YAHOO.CMS.widget.Tips
YUI-CMS widget to apply tooltips to the whole document, including dynamic areas.

Comming Soon

YAHOO.util.Dispatcher
The new dispatcher will support cross-domains capabilities using the most common techniques (both: proxy and iframe). (update comming soon)

YAHOO.CMS.widget.Tips
The new tooltip manager will support dynamic tips (fetching the information remotely using ajax). (update comming soon)

Comming Soon

YAHOO.util.Dispatcher
The new dispatcher will support cross-domains capabilities using the most common techniques (both: proxy and iframe). (update comming soon)

YAHOO.CMS.widget.Tips
The new tooltip manager will support dynamic tips (fetching the information remotely using ajax). (update comming soon)