background movement is not smooth

In my website, I have tried to make the effect where the background moves slower than the contents in the foreground. It works, but is a bit choppy. Could anyone review the javascript and see if it could be made better?

document.getElementById("homepage").onscroll = function myFunction() {
var scrolltotop = document.scrollingElement.scrollTop;
var xvalue = "center";
var factor = 0.5;
var yvalue = scrolltotop * factor;

var indexSectionPicture = document.getElementById("index-section-picture");
indexSectionPicture.style.backgroundPosition = xvalue + " " + yvalue + "px";

var indexSectionPicture2 = document.getElementById("index-section-picture-2");
indexSectionPicture2.style.backgroundPosition = xvalue + " " + yvalue + "px";}

The website is encryptool.github.io