Can't disable the feature to click outside of modal and close

Question

I have a bootstrap modal that I've set to open on page load, which works perfectly.

<script type="text/javascript"> 
$(window).on('load',function(){
    $('#my_modal').modal('show');
    $("#my_modal").modal({
        backdrop: 'static',
        keyboard: false
    });

});
</script>

Answer 1

Add the show property to the modal and only call once

<script type="text/javascript"> 
$(window).on('load',function(){
    $("#my_modal").modal({
        backdrop: 'static',
        keyboard: false,
        show: true // added property here
    });
});
</script>

Answer 2

I just used .add instead of .toggle inside window event which fixed the issue.

function windowOnClick(event) {
  console.log(event.target)
    if (event.target == modal) {
         modal.classList.add("modal-show");
    }
}