I found a very interesting little trick today. When i’m creating a new page in a web application i do a lot of css editing. This usually involves making a change to my css file, saving it, going in to Internet Explorer and refreshing the page. Which if it’s an AJAX page can be annoying, as i will have to start from scratch every time i make a minor modification to the CSS.
The first solution for re-loading the CSS i found on the web would crash if run more than once within Internet Explorer. However, i have come up with a solution which i will now reveal to you!
page, pick a name for the favelet, click the Scrunch
button and finally right-click the link it gives you and add it to your bookmarks/favourites.
var e = document.getElementsByTagName('link');
var dt = new Date();
for (var i=0; i<e.length; i++)
var s = e[i].href.split("?");
I have tested this by knocking up a simple web page with an external css file, and it worked perfectly over several updates. I had to make it check the href ended with css, as i have some embedded stylesheets in one of my ASP.NET solutions and the links don’t end in css. The real trick was in getting IE to not crash when you run it more than once. That was achieved by clearing the href and then re-setting it again, rather than adding a random element to the href as part of a querystring.
This could easily be modified to refresh the CSS every x seconds. I have seen someone who did it every 2 seconds, but i think that’s a bit too often for my needs. It wouldn’t take much to write a pair of start/stop auto-refresh favelets.
Hope that helps someone out, it’s certainly going to make my life easier and save a lot of time.