Scroll to div ID

<!DOCTYPE html>
<html>
<head>
	<title>Scroll to div ID | par NGLESSON</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="keyword" content="Scroll to div ID">
	<meta name="author" content="Mezgani said">
	<meta name="copyright" content="NGLESSON">
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
	<link href="style.css" rel="stylesheet">
</head>
<body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <button class="btn btn-md btn-info" onClick="scrollToBottom('div')">Scroll Div to Bottom</button>
                <button class="btn btn-md btn-info" onClick="scrollSmoothToBottom('div')">Scroll Smooth to Bottom</button>
                <div id="div" class="text-center">
                   This is Top of Div
                  <span>This is Bottom of Div</span>
                </div>
                <button class="btn btn-md btn-primary" onClick="scrollToTop('div')">Scroll Div to Top</button>
                <button class="btn btn-md btn-primary" onClick="scrollSmoothToTop('div')">Scroll Smooth to Top</button>
            </div>
        </div>
    </div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>                       
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>                      
<script src="script.js"></script> 
</body>
</html>
body {
    overflow-x: hidden;
    overflow-y: visible;
    background-color: #EEE;
}
#div {
    width: 100%;
    height: 600px;
    overflow-x: hidden;
    overflow-y: visible;
}
#div span {
    position: relative;
    top: 2000px;
}
function scrollToBottom (id) {
    var div = document.getElementById(id);
    div.scrollTop = div.scrollHeight - div.clientHeight;
}
function scrollToTop (id) {
    var div = document.getElementById(id);
    div.scrollTop = 0;
}
function scrollSmoothToBottom (id) {
    var div = document.getElementById(id);
    $('#' + id).animate({
        scrollTop: div.scrollHeight - div.clientHeight
    }, 500);
}
function scrollSmoothToTop (id) {
    var div = document.getElementById(id);
    $('#' + id).animate({
        scrollTop: 0
    }, 500);
}

Timeline style07

Timeline style07

SwiperJS style01

SwiperJS style01

Lightbox gallery style01

Lightbox gallery style01

Input file style02

Input file style02

Input file style01

Input file style01

Header with background animate 01

Header with background animate 01

Creation dune icone de prechargement avec css

Creation dune icone de prechargement avec css

Changer le style du scroll bar in html

Changer le style du scroll bar in html

Carousel 8 bloc with B4

Carousel 8 bloc with B4

Background div gradient

Background div gradient

Ajouter une pagination1

Ajouter une pagination1

Ajouter multiple input dynamique

Ajouter multiple input dynamique