javascript - Make Dropdown close on selection? -
i trying dropdown menu close after makes selection within dropdown. here javascript code horizontal dropdown..
;( function( window ) { 'use strict'; var document = window.document; function extend( a, b ) { for( var key in b ) { if( b.hasownproperty( key ) ) { a[key] = b[key]; } } return a; } function cbphorizontalslideoutmenu( el, options ) { this.el = el; this.options = extend( this.defaults, options ); this._init(); } cbphorizontalslideoutmenu.prototype = { defaults : {}, _init : function() { this.current = -1; this.touch = modernizr.touch; this.menu = this.el.queryselector( '.cbp-hsmenu' ); this.menuitems = this.el.queryselectorall( '.cbp-hsmenu > li' ); this.menubg = document.createelement( 'div' ); this.menubg.classname = 'cbp-hsmenubg'; this.el.appendchild( this.menubg ); this._initevents(); }, _openmenu : function( el, ev ) { var self = this, item = el.parentnode, items = array.prototype.slice.call( this.menuitems ), submenu = item.queryselector( '.cbp-hssubmenu' ), closecurrent = function( current ) { var current = current || self.menuitems[ self.current ]; current.classname = ''; current.setattribute( 'data-open', '' ); }, closepanel = function() { self.current = -1; self.menubg.style.height = '0px'; }; if( submenu ) { ev.preventdefault(); if( item.getattribute( 'data-open' ) === 'open' ) { closecurrent( item ); closepanel(); } else { item.setattribute( 'data-open', 'open' ); if( self.current !== -1 ) { closecurrent(); closepanel(); } self.current = items.indexof( item ); item.classname = 'cbp-hsitem-open'; self.menubg.style.height = submenu.offsetheight + 'px'; } } else { if( self.current !== -1 ) { closecurrent(); closepanel(); } } }, _initevents : function() { var self = this; array.prototype.slice.call( this.menuitems ).foreach( function( el, ) { var trigger = el.queryselector( 'a' ); if( self.touch ) { trigger.addeventlistener( 'touchstart', function( ev ) { self._closemenu( this, ev ); } ); } else { trigger.addeventlistener( 'click', function( ev ) { self._closemenu( this, ev ); } ); } } ); window.addeventlistener( 'resize', function( ev ) { self._resizehandler(); } ); }, // taken https://github.com/desandro/vanilla-masonry/blob/master/masonry.js david desandro // original debounce john hann // http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/ _resizehandler : function() { var self = this; function delayed() { self._resize(); self._resizetimeout = null; } if ( this._resizetimeout ) { cleartimeout( this._resizetimeout ); } this._resizetimeout = settimeout( delayed, 50 ); }, _resize : function() { if( this.current !== -1 ) { this.menubg.style.height = this.menuitems[ this.current ].queryselector( '.cbp-hssubmenu' ).offsetheight + 'px'; } } } // add global namespace window.cbphorizontalslideoutmenu = cbphorizontalslideoutmenu; } )( window );
if please me out great.
Comments
Post a Comment