使用jQuery 控制CSS變換不同Class樣式，達到同一頁面切換成不同顯示效果。如以下使用圖文模式、圖片模式及文字模式，分別為三種class(.vw_01、.vw_02.、vw_03)做切換。
jQuery
$(function(){
// 預設顯示第一個 Tab
var _showTab = 0;
$('ul.switch-button li').eq(_showTab).addClass('turnon');
$('ul.switch-button li').click(function() {
var $color = $(this)
$color.addClass('turnon').siblings('.turnon').removeClass('turnon');
});
$('#sw_01').click(function() {
$('.content-wrapper dl').addClass('vw_01').removeClass('vw_02 vw_03');
});
$('#sw_02').click(function() {
$('.content-wrapper dl').addClass('vw_02').removeClass('vw_01 vw_03');
});
$('#sw_03').click(function() {
$('.content-wrapper dl').addClass('vw_03').removeClass('vw_01 vw_02');
});
});