11th April 2009
I realise this is quite a long article, so if you're too eager, just hit the back-tick key under escape. Evaluate 'window', too. Just for fun ;-)
Well a number of possibilities occurred to me. A nice gui for editing CSS changes by selecting html elements and adjusting the rules would be swell. Something like the way Firebug does. The downside of the Firebug approach is that changes get lost and you end up having to replicate the changes in your original source anyway. Great for playing around with, but anything more is painful.
So I thought that an enhanced version of that would be neat; something that keeps track of your changes and when you're fully happy with it, you can simply export all the changed files. Still, implementing that would be a fearsome task.
Then the obvious hit me in the face: why not just add the ability to just refresh the CSS files themselves? Well happily this approach was very simple to implement by extending my debug.js class.
I also threw in a quick cookie lister, free of charge naturally.
Anyway, I hope you find those functions useful. Aside from those new functions, the original Debug.js class was a basic debug message logging system. It contains the usual methods for writing errors, warnings or trace statements to the log itself (which is made visible using the back-tick key - the one under the escape key - go on, give it a try!):
If ever you want an easy way to inspect any page on the internet, why not try this handy bookmarklet. Just drag it into your favourites and click it whenever you want access to the console:Debug Page
Thanks for reading!