SsmirmarkJun 8, 2016
How do the "switcher" that appears on the right of the screen?
Show switcher right screen
2 replies · opened Jun 8, 2016
SsmirmarkJun 8, 2016
I saw there is a “Style Switcher ” but could not find it on the downloaded file.
Could you let me know where I can find it?
Thank you!
SSemicolon WebSTAFFJun 10, 2016
Hello,
The Switcher has been added only for the Live Preview Purposes. However if you would like to use it you can Download it here: https://www.dropbox.com/s/ggzz1rcomdspqbz/switcher.zip?dl=1 . Please include the switcher-head.php in the <head> Tag and switcher-foot.php just before the </body> Tag at the end of the Document.
To make the Switcher revealed from the Right, please add the following CSS code at the bottom of the switcher.css File:
.switcher {
left: auto;
right: -260px;
border: 1px solid #DDD;
border-right: 0;
}
.switcher-trigger {
left: -48px;
right: auto;
border: 1px solid #DDD;
border-right: 0;
border-radius: 4px 0 0 4px;
-moz-border-radius: 4px 0 0 4px;
-webkit-border-radius: 4px 0 0 4px;
}Then find the following code in the switcher.js File:
$(".switcher").css('left', '-260px');
$(".switcher-trigger").click(function(){
if ($('.switcher').hasClass('closeswitcher')){
$('.switcher').animate({left:'-260px'}, 300, 'easeOutQuad', function(){
$('.switcher').removeClass('closeswitcher');
});
} else {
$('.switcher').animate({left:0}, 300, 'easeOutQuad', function(){
$('.switcher').addClass('closeswitcher');
});
}
return false;
});and replace it with:
$(".switcher").css('right', '-260px');
$(".switcher-trigger").click(function(){
if ($('.switcher').hasClass('closeswitcher')){
$('.switcher').animate({right:'-260px'}, 300, 'easeOutQuad', function(){
$('.switcher').removeClass('closeswitcher');
});
} else {
$('.switcher').animate({right:0}, 300, 'easeOutQuad', function(){
$('.switcher').addClass('closeswitcher');
});
}
return false;
});This will definitely work fine. Let us know if we can help you with anything else or if you find any further issues.
Have the same question, or something new?
Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.
Reply on the dashboard