How can I edit this Javascript without blocking functionality?

Question

So I inherited some code that I am trying to customize and I've hit a roadblock. I believe this little piece of code is the issue:

jQuery(function($){
var photos = [
'cover/001_final.jpg',
'cover/002_final.jpg',
'cover/003_final.jpg',
'cover/004_final.jpg',
'cover/006_final.jpg',
'cover/007_final.jpg',
'cover/008_final.jpg',
'cover/009_final.jpg',
'cover/044_final.jpg',
'cover/085_final.jpg',
'cover/123_final.jpg' ]

$.backstretch(photos[Math.floor(Math.random() * photos.length)]);

$(document.body).on("backstretch.show", function () {
$('body').addClass('load');
});

$('.nav-link a')
  .hover(
    function() { $(this).addClass('hover'); },
    function() { $(this).removeClass('hover'); })
  .click(function(){
    $(this).removeClass('hover');
  });
});

If I understand correctly, this script is randomly loading the backgrounds and then stretching the images and then loading the menu...

..I would like to use the menu feature on another page that does not require a stretched background, how can I remove the dependency on the background loading/stretching and just load the menu?

Thanks in advance.

Answer 1

Try using :

$(function () {
    $('body').addClass('load');
});

Instead of :

$(document.body).on("backstretch.show", function () {
    $('body').addClass('load');
});