Return to Snippet

Revision: 12278
at March 9, 2009 02:30 by jadedbat


Initial Code
<script type="text/javascript">
	// create a number with Date and getTime
	var x = new Date().getTime();
	
	// create a variable with the path to your css file?=
	var css="css/styles.css?="+x;
	
	// write the link tag with new css var
	document.writeln('<link rel="stylesheet" type="text/css" href="'+css+'">');
</script>
<noscript><link rel="stylesheet" type="text/css" media="all" href="css/styles.css" /></noscript>

Initial URL
http://www.thatgrafix.com

Initial Description
This is sometimes not the best solution to a server caching your css files.  But if you want to force a stubborn server to serve the most recent css file to the browser this seems to work.  Could slow things down a touch, but for small css files not really noticeable. 

Just change the var css to match the path to your css file, and then offer a non jscript version pointing to the same file.

Essentially by adding the query to the end of the css file the server thinks it needs to load it.  I used date and getTime to create a number combo and tagged it to the end.

Use: put the following code into your <head> right where your normal <link> tag would go to point to your css file.

Initial Title
Force server to load latest CSS file

Initial Tags
css, javascript, query, cache

Initial Language
CSS