2

I have a font size function for accessibility, how do I save the font size to a session so that the users fonts size is restored when they navigate to a new page?

Here is the fiddle I used to base my font size function on: http://jsfiddle.net/R3NGU/7/

JQUERY:

var defaultFontSize = $('html').css('font-size');

        $(".resetFont").click(function () {
            $('html').css('font-size', defaultFontSize);
        });

        $(".increaseFont").click(function () {
            var fontSize = getFontSize();
            var newFontSize = fontSize + 1;
            setFontSize(newFontSize);
            return false;
        });

        $(".decreaseFont").click(function () {
            var fontSize = getFontSize();
            var newFontSize = fontSize - 1;
            setFontSize(newFontSize);
            return false;
        });

        function getFontSize() {
            var currentSize = $("html").css("font-size");
            var currentSizeNumber = parseFloat(currentSize, 12);
            if (currentSizeNumber > 24) {
                currentSizeNumber = 24;
            }
            if (currentSizeNumber < 10) {
                currentSizeNumber = 10;
            }
            return currentSizeNumber;
        }

        function setFontSize(size) {
            $("html").css("font-size", size);
            $(".actualSize").html(size);
        }
Amesey
  • 822
  • 2
  • 16
  • 33

1 Answers1

2

You should use cookies, because session variables are server-side:

To set a cookie:

document.cookie = "fontSize=" + getFontSize();

To get cookies:

var cookies = document.cookies;

More information and source for the above example may be found here.

The fiddle with cookie functionality is available here

Filnor
  • 1,290
  • 2
  • 23
  • 28
  • Thanks, but i'm such a novice I dont know how to write this into my current script. – Amesey Jul 11 '17 at 10:12
  • @Amesey Does the following fiddle work for you? [Forked JSFiddle](http://jsfiddle.net/8ayhrqdd/) – Filnor Jul 11 '17 at 11:52
  • It does, but it doesn't remember the font size when you change page, which is what I was trying to achieve. – Amesey Jul 11 '17 at 15:28
  • @Amesey For cross-site cookie you must set the domain and the path like in [this example](http://jsfiddle.net/pbdevch/8ayhrqdd/3/) to make it work. Please note that you'll probably need to change the value for the domain. – Filnor Aug 07 '17 at 10:33
  • @Amesey Did my updated fiddle (http://jsfiddle.net/pbdevch/8ayhrqdd/3/) work you? Or did you got your issue solved on a other way? – Filnor Oct 17 '17 at 13:34
  • @chasde_ i believe I never got the cookie to save to cookie. – Amesey Oct 18 '17 at 15:12