我见过许多 css 切换器，它们放置一个按钮，允许用户更改样式以适合他们的口味。我正在寻找尚未找到的类似解决方案。
这是最接近的：http://net.tutsplus.com/demos/03_jQueryStyleSwitcher/demo/index.php# http://net.tutsplus.com/demos/03_jQueryStyleSwitcher/demo/index.php#
我希望我的页面每 x 秒从一个样式表淡出到下一个样式表，因此 css 每 x 秒就会完全更改。为了简单起见和一些漂亮的过渡，我想在 jquery 中完成它。再次强调，我希望这一切能够自动发生，无需点击任何按钮。有人看到可以做到这一点的代码吗？
您可以清除实际加载样式表的代码，并通过 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 );
Update：我今天花了一些时间将示例转换为适合我的选择插件。你可以在我的博客上找到代码，http://farm-fresh-code.blogspot.com/2009/08/jquery-theme-manager-plugin.html http://farm-fresh-code.blogspot.com/2009/08/jquery-theme-manager-plugin.html。以下是我可能会如何继续使用它。这适用于 theme1.css、theme2.css 等。即 url 处的样式：/example.com/styles/theme1.css，...
Script:
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:
<input type='hidden' class='theme' value='theme1' />
<input type='hidden' class='theme' value='theme2' />
<input type='hidden' class='theme' value='theme3' />
Demo:
使用选择和链接的代码演示可以在以下位置找到：http://myweb.uiowa.edu/timv/retheme-demo http://myweb.uiowa.edu/timv/retheme-demo.
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
