Thursday 15 August 2013

javascript - Change variable based on which element is clicked -



javascript - Change variable based on which element is clicked -

it possible alter variable within function based on element user clicks? in case work 1 kind of menu need 2 identical menu 1 difference - sec click handler must load toggledrawer changed $sidebar $navbar variable.

/* variables */ var $sidebar = $('#sidebar'), $navbar = $('#navbar'), draweropen = false, /* functions */ closedrawer = function() { draweropen = false; $body.css('overflow','').removeclass('sidebar-open'); $sidebar.removeclass('open'); $sidebar.animate({'right':'-50%'},{duration:300}); $(this).hide(); }, opendrawer = function() { draweropen = true; $body.addclass('sidebar-open').css('overflow','hidden'); $sidebar.addclass('open'); $sidebar.animate({'right':'0%'},{duration:300}); }, toggledrawer = function() { if (draweropen) { closedrawer(); }else{ opendrawer(); } }, /* bind events */ $document.on('click', '.drawer-toggle-sidebar', function(event){ toggledrawer(); event.preventdefault(); }); $document.on('click', '.drawer-toggle-navbar', function(event){ toggledrawer(); event.preventdefault(); });

to elaborate on above comment, , show example:

here functions passing in element wish open/close:

class="snippet-code-js lang-js prettyprint-override">/* functions */ closedrawer = function(drawer) { draweropen = false; $body.css('overflow','').removeclass('sidebar-open'); drawer.removeclass('open'); drawer.animate({'right':'-50%'},{duration:300}); $(this).hide(); }, opendrawer = function(drawer) { draweropen = true; $body.addclass('sidebar-open').css('overflow','hidden'); drawer.addclass('open'); drawer.animate({'right':'0%'},{duration:300}); }, toggledrawer = function(drawer) { if (draweropen) { closedrawer(drawer); }else{ opendrawer(drawer); } },

and bind events:

class="snippet-code-js lang-js prettyprint-override">/* bind events */ $document.on('click', '.drawer-toggle-sidebar', function(event){ toggledrawer(event.currenttarget); event.preventdefault(); }); $document.on('click', '.drawer-toggle-navbar', function(event){ toggledrawer(event.currenttarget); event.preventdefault(); });

you combine 2 on click events 1 , pass in currenttarget.

i hope helps.

javascript jquery object var

No comments:

Post a Comment