I'm trying to make a button you can press on the webpage that will change its background with a snow gif I prepared. I got the button to show and hide the gif and even append it, but can't seem to make it change the full background to make it seem like it started snowing. Here's the code for that:

function snowing(){
            let x = document.getElementById('hideimage');
            document.getElementById('sno_btn').onclick = function(){
                if (x.style.display === "none") {
                    x.style.display = "block";
                    document.body.style.backgroundImage = "url('snow.gif') no repeat scroll center";
                } else {
                    x.style.display = "none";
                    document.body.style.background = "black";
                }
        }

Right now, I just have the gif hidden on the page until I need it. If someone can point me in the right direction, if I can achieve this with Javascript or not, or if I should be looking deeper?