tests/manual/buttons.html

	buttons.html revision eae7322ef3fe4ed2c201fef237c51b28d4c333ed
6739cf90e4aa3b3344768b8da241802f80ff455cvboxsync<!DOCTYPE html>
72e560433c691132e8f21f463955515d4511c34bvboxsync<html>
72e560433c691132e8f21f463955515d4511c34bvboxsync    <head>
72e560433c691132e8f21f463955515d4511c34bvboxsync        <!-- reset the default browser styles -->
72e560433c691132e8f21f463955515d4511c34bvboxsync        <style>
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync            /* Fix this - Shouldn't require body specificity */
72e560433c691132e8f21f463955515d4511c34bvboxsync            body .yui3-button-selected {
72e560433c691132e8f21f463955515d4511c34bvboxsync                background-color:#426FD9;
72e560433c691132e8f21f463955515d4511c34bvboxsync                color:white;
72e560433c691132e8f21f463955515d4511c34bvboxsync            }
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync        </style>
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync        <script src='/build/yui/yui-min.js'></script>
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync        <script>
72e560433c691132e8f21f463955515d4511c34bvboxsync            YUI({
72e560433c691132e8f21f463955515d4511c34bvboxsync                debug: true,
72e560433c691132e8f21f463955515d4511c34bvboxsync                combo: false,
72e560433c691132e8f21f463955515d4511c34bvboxsync                filter: 'raw'
72e560433c691132e8f21f463955515d4511c34bvboxsync            }).use('button', function(Y){
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync                var group = new Y.ButtonGroup({
72e560433c691132e8f21f463955515d4511c34bvboxsync                    buttons: new Y.Buttons({
72e560433c691132e8f21f463955515d4511c34bvboxsync                        srcNodes: Y.all('.group')
72e560433c691132e8f21f463955515d4511c34bvboxsync                    }),
72e560433c691132e8f21f463955515d4511c34bvboxsync                    type: 'checkbox'
72e560433c691132e8f21f463955515d4511c34bvboxsync                });
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync                group.on('selectionChange', function(e){
72e560433c691132e8f21f463955515d4511c34bvboxsync                    console.log('Changed');
72e560433c691132e8f21f463955515d4511c34bvboxsync                });
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync            });
72e560433c691132e8f21f463955515d4511c34bvboxsync        </script>
72e560433c691132e8f21f463955515d4511c34bvboxsync    </head>
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync    <body class='yui3-skin-sam'>
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync        <h1>Buttons prototype</h1>
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync        <hr />
72e560433c691132e8f21f463955515d4511c34bvboxsync
72e560433c691132e8f21f463955515d4511c34bvboxsync        <input type='button' class='group' value='1'>
72e560433c691132e8f21f463955515d4511c34bvboxsync        <input type='button' class='group' value='2'>
72e560433c691132e8f21f463955515d4511c34bvboxsync        <input type='button' class='group' value='3'>
72e560433c691132e8f21f463955515d4511c34bvboxsync        <input type='button' class='group' value='4'>
72e560433c691132e8f21f463955515d4511c34bvboxsync        <input type='button' class='group' value='5'>
72e560433c691132e8f21f463955515d4511c34bvboxsync        <input type='button' class='group' value='6'>
72e560433c691132e8f21f463955515d4511c34bvboxsync    </body>
72e560433c691132e8f21f463955515d4511c34bvboxsync</html>