Search code examples
jqueryhtmltoggleclass

jQuery -onClick - How to change background on every page on website


I'm using jQuery toggleClass to change body background of the page when particular img link is clicked.
HTML:

    <a href="#"><img class="img1" src="[...]" id="b-w"></img></a>

CSS:

    .black-white{
    background: #000000;
    }  

jQuery:

    $( function() {
    $('#b-w').click( function() {
    $('body').toggleClass("black-white");
    });
    });  

Now, that works perfect, but only for the current page. The thing that I want is this: Every page on my site should change color to black and stay like that until the particular img link is clicked again, so browsing through site's pages wont change that style.

I did not found any solution on web, and my time is running out, so I cant play with it. If anyone had similar situation, or have an idea how to solve it - please respond..


Solution

  • You have many options, you can save the background color between pages using:

    • cookies
    • HTML5 Local Storage
    • Server sessions