Skip to content

Instantly share code, notes, and snippets.

@andycole
Created May 2, 2014 08:32
Show Gist options
  • Save andycole/9b29cfbb6e7ae24e3728 to your computer and use it in GitHub Desktop.
Save andycole/9b29cfbb6e7ae24e3728 to your computer and use it in GitHub Desktop.
Switch to desktop view of a responsive site - Edit viewport size
/*
* Class forceDesktopSite - Handles switching between desktop and responsive site for mobile user who want desktop experience.
*/
var forceDesktopSite = {
targetWidth: 1024,
viewport: $('meta[name="viewport"]'),
init: function() {
//Show button to switch versions
$('.rs-link').css('display', 'inline-block');
// check to see if local storage value is set on page load
localStorage['isResponsive'] = (localStorage['isResponsive'] == undefined) ? 'true' : localStorage['isResponsive'];
// if the user previously chose to view full site, change the viewport
if(localStorageCheck()){
if(localStorage['isResponsive'] == 'false'){
forceDesktopSite.showFull();
}
}
$(document).on('click', '#view-full', function(){
forceDesktopSite.showFull();
});
$(document).on('click', '#view-responsive', function(){
forceDesktopSite.showMobile();
});
},
showFull: function() {
localStorage['isResponsive'] = 'false';
forceDesktopSite.viewport.attr('content', 'width=' + forceDesktopSite.targetWidth);
$('#view-full').html('View Mobile Site').attr('id', 'view-responsive');
},
showMobile: function() {
localStorage['isResponsive'] = 'true';
forceDesktopSite.viewport.attr('content', 'width=device-width');
location.reload();
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment