CSS樣式表之間切換

因此，與這個問題了，我想用這個代碼從這裏：How do I switch my CSS stylesheet using jQuery?CSS樣式表之間切換

我需要將多個CSS樣式，而不是兩個用下面的代碼（jQuery的）之間切換：

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

可以工作嗎？我喜歡樣式之間的平滑過渡，這與我嘗試過的許多其他代碼示例不同。

來源

2016-05-27 Akidus

是的，它會工作。 <link>是<head>還是<body>。

這是一個基本的樣品，

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>

來源

2016-05-27 04:02:59 choz

沒有使用的JavaScript多達Jquery的，可我4個風格之間切換？ – Akidus

@Akidus是的，你可以切換到多種風格沒有問題。但這是一個很糟糕的做法，儘管我無法完全證明這一點。你爲什麼想做這個？ – choz

你推薦什麼？除非，你有一個在同一個網頁上切換壁紙的想法。 – Akidus

CSS樣式表之間切換

回答

相關問題