One annoying aspect of writing a stylesheet is having to reload the page in your browser to see your incremental changes. There are ways to workaround this, but I find them less than ideal so I created ReloadCSSEvery. It refreshes only the CSS of a loaded page every 2 seconds so you can use your CSS editor of choice and see semi-real-time changes in your browser when you save.
How it works
Every 2 seconds the script adds a unique query string to the
href of any stylesheet
link elements, causing them to reload the file. Note, the script only updates
link elements and not “alternative” stylesheets, so pages with styleswitchers or
@import-ed stylesheets may not be completly refreshed. Uncompressed source
Other workarounds for “live” CSS editing
- Jesse Ruderman’s classic edit styles bookmarklet lets you see real-time changes, but is limited to Firefox and can only allow editing in a plain textarea without syntax highlighting or autocomplete.
- Similarly, Opera now offers a CSS editor (it’s essentially a bookmarklet, too), but it destroys the original CSS formatting and any comment hacks, etc.
- Opera’s “Reload every” feature allows you to reload a page at the interval of your choice, but the browser must reload and reparse all markup, rerun scripts, etc, so this is less than optimal. Still a nice feature out-of-the-box for watching last-minute eBay actions, etc.