View difference between Paste ID: h3j9kvED and xY3nvkpA
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
});