yahoo mail checkbox

Question

On the web 2.0 version of yahoo email you have the option to select all the emails with one click. I'm interested about how the yahoo maked the green checkedbox

Answer 1

I'd suppose they use JavaScript to toggle the state of the checkboxes:

var toggleCheckboxes = function(checkboxes, state) {
    for (var i = 0, l = checkboxes.length; i < l; i++)
        checkboxes[i].checked = state;
};
// usage:
var chks = document.getElementsByTagName('input');
// you could also filter this to only get inputs with "type=checkbox"
toggleCheckboxes(chks, true);
// true means we should check them. Use false to uncheck them.

Answer 2

You can style form elements in most modern browsers, the easiest way to do it might be with jQuery: http://www.jquery.com

There are some plugins that style form elements, and add the "check all" functionality.

Answer 3

function checkAll(list, state)
{
    for (i = 0; i < list.length; ++i)
    {
      list[i].checked = state ;
    }
}

You need to use something like

onClick="javascript:checkAll(document.myform.list, true)"