自动jquery样式表切换器

我见过很多css切换器，它们放置一个按钮，允许用户根据自己的口味改变风格。 我正在寻找一个我还没有找到的类似解决方案。

这是最接近的： http ： //net.tutsplus.com/demos/03_jQueryStyleSwitcher/demo/index.php#

我希望我的页面每隔x秒从一个样式表淡化到下一个样式表，因此css每x秒完全更改一次。 我想在jquery中为简单和一些不错的过渡做到这一点。 同样，我希望这可以自动发生，无需点击任何按钮。 有人看到任何可以做到这一点的代码吗？

Answer 1

您可以清除实际加载样式表的代码，并从setInterval调用而不是单击按钮触发它。 您需要提供样式表的URL。 这可以存储在javascript数组中，您可以简单地在间隔计时器触发的函数中旋转数组的元素（或随机选择一个）。 然后，您将推进索引（mod数组大小）以获取要显示的下一个样式。

var styles = [ '/example.com/css/style1.css', '/example.com/css/style2.css' ]; var currentStyle = 0; setInterval( function() { currentStyle = (currentStyle + 1) % styles.length; loadStylesheet( currentStyle ); }, 5000 ); 

更新 ：今天我花了一些时间将示例转换为一个适用于我的插件。 您可以在我的博客上找到该代码， http：//farm-fresh-code.blogspot.com/2009/08/jquery-theme-manager-plugin.html 。 这是我可能会继续使用它。 这适用于theme1.css，theme2.css等。这是url上的样式：/example.com/styles/theme1.css，…

脚本：

 var currentTheme = 0; var themes = $('.theme'); themes.retheme({ baseUrl: '/example.com/styles', loadingImg: '/example.com/images/image.gif' }); setInterval( function() { currentTheme = (currentTheme + 1) % themes.length; themes.eq(currentTheme).trigger('click'); }); 

HTML：

演示：

可以在http://myweb.uiowa.edu/timv/retheme-demo找到使用select和链接的代码演示。