Updating parallax src image doesn't work without reloading of page

[DeeptiMota]

Hi There,

I have implemented parallax effect in the top header (~400px) of my website and have an functionality to change that banner image by browsing a new image.

To achieve the same, I need to store the browsed file address locally, need to reload the page and then set the stored image file while loading of the age. Code:

<script>
if (bannerImgBrowser.value == "" || bannerImgBrowser.value == null || bannerImgBrowser.value == undefined) {
    bannerPic.setAttribute('data-image-src', '../img/banner_profile.jpg');
} else {
    bannerPic.setAttribute('data-image-src', localStorage.getItem('browsedImgSrc'));
}

$("body").delegate("#banner_img", "change", function(event) {
    var reader = new FileReader();
    reader.onload = function(e) {
        localStorage.setItem('browsedImgSrc', e.target.result);
        location.reload();
    }
    var file = event.target.files[0];
    reader.readAsDataURL(file);
});
</script>

Can't it be achieved simply, without reload()?

[C-o-d-e-C-o-w-b-o-y]

var ImageArray = ['img/code-bg-1.png','img/code-bg-2.png','img/code-bg-3.png','img/code-bg-4.png'];

$('.parallax-slider').eq(1).attr("src", ImageArray[Math.floor(Math.random() * ImageArray.length)]);

here is an example where I am randomly choosing an image. Try editing the 'src' attribute of the 'parallax-slider' class instead.

[DeeptiMota]

Didn't work for me. Any other option?

[DeeptiMota]

Just removed ".eq(1)" from the provided example and it worked, ref: https://stackoverflow.com/questions/29020247/changing-the-parallax-image-in-parallax-js.

Thanks!