Change background colour upon refresh

[fernandol97]

This post is deleted!

[fernandol97]

I have found the following code on the forum form a couple years ago. however it does not seem to work. Can anyone tell me what i am doing wrong? here is a link to the site: http://mungoadam-smith.co.uk/category/work/

    var colors = ["#551066", '#7b4289', '#a09d24', '#3f3e19', '#3a6b39', '#98c197', '#ab97c1']
    Frontend.GlobalEvents.on("newpageshown", function(){
        var ix = getRandomInt(0, colors.length);
        var color = colors[ix];
        jQuery('body').css('background-color', color);
    });
    
    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random
    // Returns a random integer between min (included) and max (excluded)
    // Using Math.round() will give you a non-uniform distribution!
    function getRandomInt(min, max) {
        min = Math.ceil(min);
        max = Math.floor(max);
        return Math.floor(Math.random() * (max - min)) + min;
    }
</script

[fernandol97]

should i be placing the code under lay options > custom CSS & HTML > Custom HTML at bottom? Any advice would be so appreciated!

[fernandol97]

ive also tried the following code :

const colors = ["#fff", "#000", "#f0f", "#0ff", "#00f", "#ff0", "#0f0"];

window.onload = () => {
  const colorToSet = colors[Math.floor(Math.random() * colors.length)];
  document.querySelector("body").style.backgroundColor = colorToSet;
};

But all that happens is a bunch of code goes to the top of the page. Pretty new to adding touching the custom css/html. 

[mariusjopen]

Dear @fernandol97
you need to wrap them into <script> tags.
Like in the example above.
Best!
Marius

[arminunruh]

hey if anyone wants to do this: use this code

<script>
var colors = ["#fff", '#000', '#f0f', '#0ff', '#00f', '#ff0', '#0f0']
window.laytheme.on("newpageshown", function(){
	var ix = getRandomInt(0, colors.length);
	var color = colors[ix];
	jQuery('#grid, #custom-phone-grid, .cover-region-desktop, .cover-region-phone, #footer, #footer-custom-phone-grid').css('background-color', color);
});

// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random
// Returns a random integer between min (included) and max (excluded)
function getRandomInt(min, max) {
	min = Math.ceil(min);
	max = Math.floor(max);
	return Math.floor(Math.random() * (max - min)) + min;
}
</script>