how to save responsive menu open/close value?


Tags: php,html,css

Problem :

We recently changed our front-end and start using Metronic responsive theme.

I have a left menu like:

enter image description here

Now since this is responsive if you click top left of the menu it resizes perfectly like this:

enter image description here

The problem is even if you resized it( for ex: small), when you click a link (or when page is refreshed), regardless of the size it automatically displays the big menu.

if (resize) {  use -> page-header-fixed page-sidebar-closed }  
else {   use ->page-header-fixed }

I know it must be something like that but how to implement this in php?

EDIT: I have an body class inside index.php like :

    </head>
    <body class="page-header-fixed">
    <?include "left.php"?>

left.php is the page that has the left menu. body class is the css class that I need to check



Solution :

Do this setting must be stored on your database? If not, why not use localStorage and manage it with - and only - JavaScript?

I don't know your menu code, but if you can watch it open and close event, you can just use:

window.localStorage.setItem("menu", 1); // 1: open - 2: closed

Then on page load read it:

window.localStorage.getItem("menu");

No need to set ajax requests to the server nor cookies and that kind of crap.


    CSS Howto..

    HTML Tables - how can I make all cells other than the last always be wide enough?

    How can I push to the top an element using slideUp?

    How to auto adjust (stretch) div height and width using jQuery or CSS

    How to achieve following style for horizontal rule with css

    How to keep transparent radial background smooth in browsers other than Chrome?

    In IE Compat View, Developer tools shows elements “style” with the class of the previous element

    How to correctly style a form?

    How to Indent using HTML or CSS

    Gulp callback - How to tell Gulp to run a task first before another?

    How can I place two headings next to each other using CSS?

    How to position content next to each other without table?

    How to do the right positioning of css elements?

    How does Grails process static files without resources plugin?

    How do I know which CSS is overriding my background image?

    How to apply CSS3 rendering for optimal performance

    How to rotate text using CSS

    How does gmail preserve copy and pasted web content, maintaining the attached CSS?

    How to apply dynamic CSS for the label in IE7

    How to hack unsupported mix-blend-mode CSS property?

    How to create smooth headlines with HTML and CSS?

    How to Horizontally Scroll Images In Single Line

    How to CSS two vertical cylinders

    How to add custom layout and css in a CakePHP application?

    Simple Form button submit doesn't show in IE 8-7

    How can I change color of visited cgridview row?

    How to apply css style for HTML element using Mootools

    How to maneuver between two divs using CSS?

    How do I keep floated child divs from wrapping?

    How can I refactor some repetitive HTML and CSS?

    How to make box light up in navigation bar - CSS