Puedes usar jquery para animar el scroll. usando el metodo `animate` le dices el tiempo que quieres que tarde. Por ejemplo poniendo `500` tardaría medio segundo al estar usando milisegundos. <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> function scroll() { const a = document.getElementById("p"); $('html, body').animate({ scrollTop: $("#p").offset().top }, 500); } <!-- language: lang-html --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button id="button" onclick="scroll()"> myButton </button> <p> parragraph </p> <p> parragraph </p> <p> parragraph </p> <div style="height: 500px;"></div> <p> parragraph </p> <p> parragraph </p> <p> parragraph </p> <p id="p"> myParragraph </p> <div style="height: 1500px;"></div> <!-- end snippet --> Respecto a por que no te funciona tu `smooth` quizá sea porque solo tiene compatibilidad con Firefox. (mira la tabla de compatibilidad del link que pusiste)