README.md

CSS z-index Layout Debugger

A tweet-sized debugger for printing out the z-index of elements that are bigger than 0, auto. Can also outline these elements on the page with a random (valid) CSS hex color.

[].forEach.call(document.querySelectorAll("*"),function(e){var t=window.document.defaultView.getComputedStyle(e).getPropertyValue("z-index");var n=parseInt(t,10);if(n>0){console.log(e);console.log(n);console.log("\n----------------")}})

annotated.js

// Log Z index of all items over 0, auto z-index

[].forEach.call(document.querySelectorAll("*"), function(a) {
    var zIndex = window.document.defaultView.getComputedStyle(a).getPropertyValue('z-index');
    //console.log(zIndex, typeof zIndex);

    var numberZ = parseInt(zIndex, 10);

    if (numberZ > 0) {
		console.log(a);
        console.log(numberZ);
    	console.log('\n----------------');
        //a.style.outline = "5px solid #" + (~~(Math.random() * (1 << 24))).toString(16)
    }
});