Código HTML:
<html>
<head>
<title>Prueba</title>
<link id="css1" href="estilo1.css" type="text/css" rel="stylesheet">
<script>
var indiceEstilo=0;
var estilos=["estilo1.css","estilo2.css"];
var tiempoMilisegundos=1000;
function tiempo(){
setInterval("inicio();",tiempoMilisegundos);
}
function inicio(){
indiceEstilo=(indiceEstilo+1)%estilos.length;
document.getElementById('css1').href=estilos[indiceEstilo];
}
</script>
</head>
<body onload="tiempo();">
<div>HOLA</div>
</body>
</html> Archivo estilo1.css
Código:
body { background-color:red; }
div { margin: 30px; width:100px; height:100px; background-color:blue; color:pink;}
Archivo estilo2.css
Código:
body { background-color:green; }
div { margin: 30px; width:200px; height:200px; background-color:black; color:white;}
La he subido a mi carpeta de experimentos.
Aquí se puede ver el ejemplo online.