jquery - Incrementing in JavaScript -

i'm trying create sliding sidebar , wondering if there better way doing already.

  <img id = "menuicon" src = "menuicon.png" alt = "menu icon" onclick = "slidesidebar()" /> 

at moment check if sideslidecount - if sidebar must not out, when function called slides out; if sideslidecount odd (i.e. % 2 != 0) sidebar should slide out of view.

var sideslidecount = 0; // variable used side bar var bodyheight = $(window).height(); var bodywidth = $(window).width(); console.log(bodywidth);  function slidesidebar() {     if (sideslidecount % 2 == 0) { // if sideslidecount even, i.e. side bar hidden         $("#sidebar").animate({width: bodywidth / 6}, 600); // slide bar out 300 width, 0.6 seconds         $("#sidelinks").fadeto(1000, 0.8); // fade links view, 1 second, 100% opacity     }     else { // else, if side bar in view         $("#sidebar").fadein(300).animate({width: 0}, 600); // slide bar out of view (0 width), 0.6 seconds         $("#sidelinks").fadeto(200, 0); // fade links out of view, 0.2 seconds, 0% opacity     }     sideslidecount++; // increment variable } 

you make code modular avoid global variables. should looking amd modules, keep simple can create namespace code live.

demo: http://jsfiddle.net/bzyuq/

//define slidingsidebar reusable component !function (ns, $) {      function slidingsidebar(el, animateduration) {         this.$el = $(el);         this.animateduration = animateduration;     }      slidingsidebar.prototype = {         constructor: slidingsidebar,          toggle: function () {             this.$el.stop().animate({ width: 'toggle' }, this.animateduration);         }     };      ns.slidingsidebar = slidingsidebar;  }(slideexamplesite = window.slideexamplesite || {}, jquery);   $(function () {     //the following behavior in configurable "slidebarfeature" module     //or integrate button directly slidingsidebar.     //i'm showing how code can modularized here.     var sidebar = new slideexamplesite.slidingsidebar('#sidebar', 600);      $('#toggle-btn').click(function () {         sidebar.toggle();     }); }); 

obviously in case slidingsidebar component doesn't much, application grows, modularizing code away $(function () {/*tons of code*/}); anti-pattern pay off in many ways.