Geek asks and answers

Automatic jquery shortcut switcher

I saw a lot of css switches that put a button that allows the user to change styles to suit their taste. I am looking for a similar solution that I have not found yet.

This is the closest: http://net.tutsplus.com/demos/03_jQueryStyleSwitcher/demo/index.php#

I want my page to disappear from one style sheet to the next every x seconds, so css changes completely every x seconds. I want to do this in jquery for simplicity and nice transitions. Again, I want this to happen AUTOMATICALLY, without clicking any button. Does anyone see any code that can do this?

0
source share
1 answer

, setInterval . URL- . javascript, ( ) , . ( ), .

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 );

. , , select. , 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' />

:

, , , http://myweb.uiowa.edu/timv/retheme-demo.

+3

More articles:


All Articles