создаем несколько отдельных тем (файлов css) с именами blue.css, red .css, pink.css и другие по адресу "css/colour-sсheme/", а на странице пишем ссылки
<a href="blue" class="new-colour blue" id="blue">blue</a>
<a href="purple" class="new-colour purple" id="purple">purple</a>
<a href="red" class="new-colour red" id="red">red</a>
<a href="green" class="new-colour green" id="green">green</a>
<a href="pink" class="new-colour pink" id="pink">pink</a>
<a href="orange" class="new-colour orange" id="orange">orange</a>
а далее вешаем обработчик (
он находится в файле )
$(document).ready(function(){
"use strict";
$('.new-colour').click(function(e){
e.preventDefault();
var id = $(this).attr('href');
var style = ('#switch-style');
$(style).attr('href', 'css/colour-scheme/' + id + '.css');
$('.style-switcher').toggleClass('style-out');
});
$('.style-open').click(function(e){
e.preventDefault();
$('.style-switcher').toggleClass('style-out');
});
});