Javascript Markers Issue

On my page i have bootstrap owl carousel and contact form. Problem is either contact form is working or carousel slider sliding pictures - one from both. I found out where the prob

Solution 1:

Try below code:

$(document).ready(function() {

    var owl = $("#owl-hero");

    owl.owlCarousel({

        navigation: false, // Show next and prev buttonsslideSpeed: 1,
        paginationSpeed: 400,
        singleItem: true,
        transitionStyle: "fade"

    });

    $("#contactForm").on("submit", function(event) {
        if (event.isDefaultPrevented()) {
        } else {
            event.preventDefault();
            submitForm();
        }
    });

});

functionsubmitForm() {
    $.ajax({
        type: "POST",
        url: "mail.php",
        data: $("#contactForm").serialize(),
        success: function(text) {
            if (text == "success") {
                $("#msgSubmit" ).removeClass( "hidden" );
                setTimeout(function() {
                    $("#msgSubmit" ).addClass( "hidden");    
                }, 6000);
            }
        },
        error : function() {
            /* You probably want to add an error message as well */
            $("#msgError" ).removeClass( "hidden" );
        }
    });
}
</script>

Solution 2:

Try to remove the comment inside the json:

$(document).ready(function() {

varowl=$("#owl-hero");owl.owlCarousel({navigation:false,slideSpeed:1,paginationSpeed:400,singleItem:true,transitionStyle:"fade"});});

It is not syntactically correct.