Переменная становится undefined внутри else

$(document).ready(function() { 
    var menusWidth = $('.menu').width(); 
    $('.article').css("margin-left", menusWidth); 
    var menu = $(".menu"); 
    var article = $(".article"); 
    var sizeLine = $("#sizeLine"); 
     
    var curr_width = menu.width() 
    var unlock = false; 
     
    $(document).mousemove(function(e) { 
        $(".menu").css("transition", "0ms"); 
        var userCursor = parseFloat(e.clientX * 100 / screen.width); 
		  var change = userCursor*screen.width/100; 
          var textWidth = screen.width - change; 
		  var menuMin= screen.width/100*15; 
       if(unlock) { 
			    if(change > (menuMin-1)){ 
				    menu.css("width", change); 
                    article.css("width", screen.width-change); 
                    $('.article').css("margin-left", change); 
                        if (parseInt($('.article').css('margin-left')) > screen.width/100*40) { 
                            $('.article').css('margin-left', screen.width/100*40); 
                        } 
                    sizeLine.css("background-color", "rgba(0, 0, 0, 0.6)"); 
			    } 
			    else { 
				    menu.css("width", screen.width/100*15); 
                    article.css("width", screen.width/100*85); 
                    $('.article').css("margin-left", menusWidth); 
                    sizeLine.css("background-color", "rgba(0, 0, 0, 0.6)"); 
            } 
        } 
    }); 
 
    sizeLine.mouseenter(function(e) { 
        sizeLine.css("background-color", "rgba(0, 0, 0, 0.6)"); 
    }) 
 
    sizeLine.mouseleave(function(e) { 
        sizeLine.css("background-color", "rgba(0, 0, 0, 0)"); 
    }) 
 
    sizeLine.mousedown(function(e) { 
        curr_width = menu.width(); 
        unlock = true; 
    }); 
 
    $(document).mousedown(function(e) { 
        if(unlock) { 
            e.preventDefault(); 
        } 
    }); 
 
    $(document).mouseup(function(e) { 
        unlock = false; 
        sizeLine.css("background-color", "rgba(0, 0, 0, 0)"); 
    }); 
}); 
 
var num = 0; 
$('#menuButton').click(function() {  
    if (num%2 == 0) { 
        var menuWidth = $(".menu").width(); 
        $(".menu").css("margin-left", -menuWidth); 
        $(".menu").css("transition", "300ms"); 
        $(".article").css("width", screen.width); 
        $(".article").css("margin-left", 0); 
        num += 1;  
        var newMenuWidth = menuWidth; 
    } else { 
        $(".menu").css("width", newMenuWidth); 
        $(".menu").css("margin-left", 0); 
        $(".menu").css("transition", "300ms"); 
        $(".article").css("width", screen.width-newMenuWidth); 
        $(".article").css("margin-left", newMenuWidth); 
        num += 1; 
    } 
});

body { 
	margin: 0; 
	padding: 0; 
	width: 100%; 
	height: 100%; 
	display: flex; 
	font-family: 'Helvetica','Sans-Serif';  
} 
 
.menu { 
	width: 15%; 
	min-width: 290px; 
	max-width: 40%; 
	height: 100vh; 
	background: #f2f2f2; 
	font-size: 18px; 
	display: flex; 
	justify-content: space-between; 
	resize: horizontal; 
	overflow: none; 
	position: fixed; 
} 
 
.menu::-webkit-scrollbar { 
  display: none; 
} 
 
 
.treeMenu { 
	margin: 40px 0 5px -20px; 
} 
 
#sizeLine { 
    float: right; 
    margin-right: 0; 
    width: 5px; 
    height: 100%; 
    background-color: rgba(0, 0, 0, 0); 
    z-index: 1; 
    cursor: e-resize; 
} 
 
.article { 
	display: flex; 
	flex-direction: column; 
	width: 85%; 
	min-width: 60%; 
	height: 100vh; 
	background: #ffffff; 
} 
 
.header { 
	height: 60px; 
	position: sticky; 
	top: 0; 
} 
 
#menuButton { 
	width: 30px; 
	height: 40px; 
	border: 0; 
	margin: 5px 0 0 10px; 
	background: #666666 no-repeat center; 
	cursor: pointer; 
	opacity: 0.5; 
} 
 
#menuButton:hover { 
	opacity: 1; 
	transition: 0.3; 
} 
 
.content { 
	width: 900px; 
	align-items: center; 
	margin: 0 auto 0; 
	display: flex; 
	text-align: center; 
	flex-direction: column; 
} 
 
.contentBox { 
	display: flex; 
	flex-direction: column; 
	max-width: 900px; 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<!DOCTYPE html> 
<html> 
<head> 
	<title>owl</title> 
	<meta charset="utf-8"> 
	<link type="text/css" rel="stylesheet" href="style.css"> 
	<link href="https://fonts.googleapis.com/css?family=Ubuntu+Mono&display=swap" rel="stylesheet"> 
</head> 
<body> 
 
	<!-- Меню -->  
 
	<div class="menu"> 
		<ol class="treeMenu"> 
			<li>Пункт1</li> 
			<li id="name2">Пункт2 
				<ol id="pp2"> 
					<li><a href="#">Подпункт</a></li> 
					<li><a href="#">Подпункт</a></li> 
					<li><a href="#">Подпункт</a></li> 
		      		<li><a href="#">Подпункт</a></li> 
		      		<li><a href="#">Подпункт</a></li> 
		      		<li><a href="#">Подпункт</a></li> 
				</ol> 
			</li> 
			<li id="name3">Пункт3 
				<ol id="pp3"> 
					<li><a href="#">Подпункт</a></li> 
					<li><a href="#">Подпункт</a></li> 
					<li><a href="#">Подпункт</a> 
						<ol id="ppp33"> 
							<li><a href="#">Подподпункт</a></li> 
							<li><a href="#">Подподпункт</a></li> 
							<li><a href="#">Подподпункт</a></li> 
						</ol> 
					</li> 
					<li><a href="#">Подпункт</a></li> 
					<li><a href="#">Подпункт</a></li> 
				</ol> 
			</li> 
			<li>Пункт4</li> 
			<li id="name5">Пункт5 
				<ol id="pp5"> 
					<li><a href="#">Подпункт</a></li> 
					<li><a href="#">Подпункт</a></li> 
				</ol> 
			</li> 
		</ol> 
		<div id="sizeLine"></div> 
	</div> 
 
 
	<div class="article"> 
		<div class="header"> 
			<input type="button" name="menuButton" id="menuButton"> 
		</div> 
		<div class="content"> 
			<div class="contentBox"> 
 
<h1>Это контент</h1> 
 
			</div> 
		</div> 
	</div> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="script.js"></script> 
</body> 
</html>