Indeterminate state demo

HTML

<label><input type="checkbox" id="checkall"> Check all</label>
<label><input type="checkbox" class="thing"> Thing 1</label>
<label><input type="checkbox" class="thing"> Thing 2</label>
<label><input type="checkbox" class="thing"> Thing 3</label>

CSS

label {
    display:block
}

label:first-child {
    font-weight:bold;
}

label:nth-child(n+2) {
    margin-left:1em;
}

JavaScript

var checkboxes = document.querySelectorAll('input.thing'),
    checkall = document.getElementById('checkall');

for(var i=0; i<checkboxes.length; i++) {
    checkboxes[i].onclick = function() {
        var checkedCount = document.querySelectorAll('input.thing:checked').length;
        
         // checkall.checked = checkedCount > 0;
        checkall.indeterminate = checkedCount > 0 && checkedCount < checkboxes.length;
    }
}

checkall.onclick = function() {
    for(var i=0; i<checkboxes.length; i++) {
        checkboxes[i].checked = this.checked;
    }
}