SHOW:
|
|
- or go back to the newest paste.
| 1 | // GLOBAL VARIABLE | |
| 2 | // set it to false by default | |
| 3 | var isMobile = false; | |
| 4 | ||
| 5 | ||
| 6 | var detectMobile = function(){
| |
| 7 | var MIN_SCREEN_WIDTH = 767; | |
| 8 | var $window = $(window); | |
| 9 | ||
| 10 | if($window.width() < MIN_SCREEN_WIDTH){
| |
| 11 | return true; | |
| 12 | }else{
| |
| 13 | return false; | |
| 14 | } | |
| 15 | }; | |
| 16 | ||
| 17 | ||
| 18 | var mobileSpecialSauce = function(){
| |
| 19 | $('li.nav-header span').hide();
| |
| 20 | //$('ul.sub-nav').hide();
| |
| 21 | $('.side-nav li.nav-header').prepend("<span class='plus collapse-symb'>[+] </span><span class='minus collapse-symb'>[-] </span>");
| |
| 22 | // changed to jquery's .on() method so that we can remove ONLY this event handler later | |
| 23 | $('.side-nav li.nav-header').on('click.mobile', function() {
| |
| 24 | $(this).next('ul.sub-nav').slideToggle();
| |
| 25 | ||
| 26 | $(this).children('span').toggle();
| |
| 27 | }); | |
| 28 | ||
| 29 | ||
| 30 | }; | |
| 31 | ||
| 32 | ||
| 33 | ||
| 34 | ||
| 35 | ||
| 36 | // update variable on load | |
| 37 | isMobile = detectMobile(); | |
| 38 | ||
| 39 | // onload run special sauce | |
| 40 | if(isMobile){
| |
| 41 | mobileSpecialSauce(); | |
| 42 | } | |
| 43 | ||
| 44 | ||
| 45 | // update variable if window is resized | |
| 46 | $(window).on('resize',function(){
| |
| 47 | isMobile = detectMobile(); | |
| 48 | if(isMobile){
| |
| 49 | mobileSpecialSauce(); | |
| 50 | - | mobileSpecialSauce(); |
| 50 | + | }else{
|
| 51 | // unbind (off) click event handler since isMobile is false | |
| 52 | $('.side-nav li.nav-header').off('click.mobile');
| |
| 53 | } | |
| 54 | }); |