some function are working well and some are not working well

some function are working well and some are not working well

Hello Friends,
      problem when i face is some jquery function like slideUp,slideDown,slideToggle,fadeToggle etc not doing well and some are well also text below mentioned code for reference, so plz guide us ..

<head>
<title>JQuery Complete Cource</title>
<script src="jquery-3.2.1.slim.js"></script>
<script>
/*Example #1*/
/*$(document).ready(function(){
$('#but').click(function(){
alert('Button has been Clicked');
});
$('.test').click(function(){
$('.test').hide();
});
});*/
/*Example #2*/
$(document).ready(function(){
$('.but').click(function(){
$('.effect').hide();
});
$('.but1').click(function(){
$('.effect').show();
});
$('.but_toggle').click(function(){
$('.effect').toggle();
});
$('.butt').click(function(){
$('.effect').fadeOut(5000);
});
});
</script>
<style>
body{
background:blue;
}
.effect{
background:red;
width:100px;
height:100px;
}
</style>
</head>
<body>
<button class="but">Click to Hide</button>
<button class="but1">Click to Show</button>
<button class="butt">Click to fade</button>
<button class="but_toggle">Click to Toggle</button>
<div class="effect">Testing</div>


</body>
</html>