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.
function scroll() {
$('html, body').animate({
scrollTop: $("#p").offset().top
},
500);
}
<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>
Para lo que pides de poder pasar una unidad y que se desplace pixeles en vez de a un elemento, puedes decir que se mueva hasta el elemento que haces click y una cantidad de pixeles extra.
function scroll() {
$('html, body').animate({
scrollTop: $("#button").offset().top + 500
},
500);
}
<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>
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)