Switching between css stylesheets

Question

So, unlike other questions about this, I want to use this code from here: How do I switch my CSS stylesheet using jQuery?

I need to switch between multiple css styles instead of two with the following code (jQuery):

$('#backgroundDefault').click(function (){ $('link[href="style1.css"]').attr('href','style.css'); }); $('#background1').click(function (){ $('link[href="style.css"]').attr('href','style1.css'); });

Can this work? I like the smooth transition between styles, unlike many other code samples I tried.

choz · Accepted Answer · 2016-05-27 04:02:59Z

Yes, it will work. Whether <link> is either in the <head> or <body>.

Here's a basic sample,

var isToggled = false; $(function() { $('#btnSwitchCss').on('click', function() { isToggled = !isToggled; if (isToggled) { $("link[href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css']").attr('href', '../'); } else { $("link[href='../']").attr('href', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'); } }) });

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> <div class="container"> <h2 class="text-center"> Switch CSS Style </h2> <button id="btnSwitchCss">Switch</button> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Haven't used Javascript as much as Jquery, could I switch between 4 styles?
@Akidus Yes, you can switch to multiple styles with no problem. But this is such a bad practice though I can't fully prove it. Why would you want to do this?
What do you recommend? Unless, you have an idea for switching between wallpaper on the same web page.
@Akidus Yeah, assign each background wallpaper as their own class in your css. And switch the class instead.
You you have an example? For some reason, I can't think of the code right now.

Collectives™ on Stack Overflow

Switching between css stylesheets

1 Answer 1

6 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Linked

Related