<link rel="stylesheet" href="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.css">

<div class="wrap">
	<ul class="slider">
		<li><img src="https://www.ameamelog.com/wp/wp-content/uploads/2019/10/progressive-image_01.jpg" alt=""></li>
		<li><img src="https://www.ameamelog.com/wp/wp-content/uploads/2019/10/progressive-image_02.jpg" alt=""></li>
		<li><img src="https://www.ameamelog.com/wp/wp-content/uploads/2019/10/progressive-image_03.jpg" alt=""></li>
	</ul>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js"></script>
<script>
$(document).ready(function(){
	$('.slider').bxSlider();
});
</script>

* {
	box-sizing: border-box;
}
body {
	min-height: 100vh;
	margin: 0;
	padding: 10vh 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
ul {
	margin: 0;
}
.wrap {
	max-width: 400px;
}