$(function() { /* For demo purposes */ var demo = $("
").css({ position: "fixed", top: "150px", right: "0", background: "rgba(0, 0, 0, 0.7)", "border-radius": "5px 0px 0px 5px", padding: "10px 15px", "font-size": "16px", "z-index": "999999", cursor: "pointer", color: "#ddd" }).html("").addClass("no-print"); var demo_settings = $("
").css({ "padding": "10px", position: "fixed", top: "130px", right: "-200px", background: "#fff", border: "3px solid rgba(0, 0, 0, 0.7)", "width": "200px", "z-index": "999999" }).addClass("no-print"); demo_settings.append( "

Layout Options

" + "
" + "
" + "" + "
" + "
" ); demo_settings.append( "

Skins

" + "
" + "
" + "" + "
" + "
" + "
" + "
" + "" + "
" + "
" ); demo.click(function() { if (!$(this).hasClass("open")) { $(this).css("right", "200px"); demo_settings.css("right", "0"); $(this).addClass("open"); } else { $(this).css("right", "0"); demo_settings.css("right", "-200px"); $(this).removeClass("open") } }); $("body").append(demo); $("body").append(demo_settings); }); function change_layout() { $("body").toggleClass("fixed"); fix_sidebar(); } function change_skin(cls) { $("body").removeClass("skin-blue skin-black"); $("body").addClass(cls); }