So I started looking for a way to auto refresh my web page as soon as I make changes any CSS files in server, after some digging I found CSSrefresh – great tool that is really easy to use and works pretty well and save a lot of time.
CSSrefresh.js – how to use
- Add following code just before </head> of your html page. If you are using wordpress you need to add this code in header.php file.
- Reload the page in browser and start editing CSS files, the script will take care of the browser.
Tips for using CSSrefresh.js
CSSrefresh.jsuses XMLHttpRequest to get the modification time of CSS files, so it can work only in a server environment.
- Only CSS files included before the
CSSrefresh.jsfile will be refreshed, so if you are working on a single file, try putting it just after that.
- Make sure to remove this once you are done with your changes because it will unnecessarily add load to the server.
- CSSrefresh.js also have a bookmarklet that you can use but I prefer to use low level APIs.