YUI recommends YUI3.

YUI 2 has been deprecated since 2011. This site acts as an archive for files and documentation.

This documentation is no longer maintained.

YUI Library Examples: Button Control: Slider Button

Button Control: Slider Button

This example demonstrates how to combine a Split Button with a Slider to create an opacity slider button, similar to that found in Adobe Photoshop.

Ella - A Shih Tzu + Maltese Mix Puppy

Begin by creating a Button instance of type "menu" and a Menu instance to house a Slider instance.

Once the new Button is created, add a listener for its "appendTo" event that will be used to render its Menu instance into the same DOM element specified as the containing element for the Button.

Lastly, add a listener for the Menu's "render" event. Once the Menu instance is rendered, the Slider markup will be in the page and it is safe to instantiate the Slider instance.

Lastly, style the <em> element wrapping the Button instance's text label with a fixed width so that the Button doesn't grow or shrink as the text label is updated.

Copyright © 2013 Yahoo! Inc. All rights reserved.

Privacy Policy - Copyright Policy - Job Openings