modal not opening in chrome browser
<div class="item col-sm-4" style="float: left; list-style: none; position: relative; width: 259.5px;" aria-hidden="false">
<a class="thumbnail video" href="#" data-video-id="https://bcove.video/2Hjh5E1" data-toggle="modal" data-title="The one stop solution for all things ‘Innovation’.">
<img class="img-responsive" src="Admin/UploadSlider/Video_201901210546167072479.jpg">
<div class="main-box main-box-sub" style="text-align:center !important;">
<span>The one stop solution for all things ‘Innovation’.</span><br>
</div>
</a>
</div>
$(function () {
$('.video').click(function () {
var videoSource = $(this).data('video-id');
var videoTitle = $(this).data('title');
var iframe = document.getElementById("vimeoIframe");
iframe.src = videoSource;
$("#MainContent_videotitle").text(videoTitle);
$("#videoModal").modal("show");
});
});
<div class="modal videoModal" id="videoModal" tabindex="-1" role="dialog" data-keyboard="false" data-backdrop="static">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close video-close" data-dismiss="modal" aria-label="Close" onclick=""><span aria-hidden="true">×</span></button>
<h4 class="modal-title" style="color: black;">
<asp:Label ID="videotitle" runat="server"></asp:Label>
</h4>
</div>
<div class="modal-body">
<div class="embed-responsive embed-responsive-16by9">
<img id="loader1" src="http://www.itgeared.com/demo/images/loading.gif" width="36" height="36" alt="loading gif" />
<iframe id="vimeoIframe" class="embed-responsive-item"
webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>