image – yahoo mail checkbox – Education Career Blog

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


You can style form elements in most modern browsers, the easiest way to do it might be with jQuery:

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


function checkAll(list, state)
    for (i = 0; i < list.length; ++i)
      listi.checked = state ;

You need to use something like

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


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++)
        checkboxesi.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.

Leave a Comment