Reset default CSS values; need help with syntax.

Reset default CSS values; need help with syntax.

Hi,

I'm building a responsive website, which includes a 'View desktop version' button on smaller screen sizes.
I know it's not necessary in the first place, but my client wants it.

So I found a method for creating such a button on this site.

After implementing the solution from the website mentioned above, I could switch to desktop view from mobile devices. However, I wanted to leave an option for going back to mobile view on the requested desktop version. I wanted this button to show up only on the desktop view requested on a mobile device and not on computers, since that would mess up my footer with an obsolete button. So I added some actions to the jQuery document which change the CSS values upon switching from mobile to desktop view.

The problem is that after switching back to mobile view the browser remembers the jQuery modified CSS values and displays the footer incorrectly. I don't know how the syntax should look for resetting the default CSS values upon hitting the 'Switch back to mobile view' button.

Here's my code:

  1. (function() {
    // viewport stuff
  2. var targetWidth = 1200;
  3. var deviceWidth = 'device-width';
  4. var viewport = $('meta[name="viewport"]');

  6. // check to see if local storage value is set on page load
  7. localStorage.isResponsive = (localStorage.isResponsive == undefined) ? 'true' : localStorage.isResponsive;
  8. var showFullSite = function(){    
  9. localStorage.responsiveViewportValue = viewport.attr('content');
  10. viewport.attr('content', 'width=' + targetWidth);  
  11. if(!$('.rwd-display-options #view-responsive').length){
  12. $('.rwd-display-options').append('<span id="view-responsive">Switch back to mobile view'.</span>');

  14. // CSS adjustments
  15. $(".ftext").css("margin-top", "13px");
  16. $(".footer").css("height", "75px");
  17. $(".wrapper").css("margin", "0 auto -75px");
  18. $(".intas").css("top", "21px");   
  19. }
  20. localStorage.isResponsive = 'false';
  21. }
  22. var showMobileOptimized = function(){
  23. localStorage.isResponsive = 'true';
  24. viewport.attr('content', localStorage.responsiveViewportValue);
  25. }        
  26. })(jQuery);
I'm more of a designer than coder but tried to describe the problem as simple as possible so I hope you can understand.

Could somebody please give me an example of the syntax in this code on resetting those CSS values?