LouisWhit
10/15/2018 - 8:57 PM

Video Modal - Captavi - Content Area

This is an image that can be clicked to pop up a modal window enabling the playing of a youtube video in the Captavi system specifically version 5.X sites.

video-modal.js
content_copyfile_download
$('.youtubeModal a').each(function(index, el) {
	$("#CaptaviModalOverlay").remove();
	var link = $(this).attr("href");
	var iframeSrc = '<iframe width="560" height="315" src="'+link+'?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>';
	var title = $(this).attr("title");
	$(this).on('click', function(event) {
		event.preventDefault();
		CaptaviModal(title,iframeSrc);
	});
});
$(".secondLevel").on('click', '.CaptaviModalClose', function(event) {
	$("#CaptaviModalOverlay").remove();
});
video-modal.html
content_copyfile_download
<!DOCTYPE html>
<html>
<head>
	<title>Video Modal</title>
	<style></style>
</head>
<body>
	<div class="container container-fluid">
		<div class="row">
			<div data-editor="image" data-title='Image' class="col-md-12 youtubeModal">
				<a href="https://www.youtube.com/embed/C7tUs-YRC0s" title="Quest Integrity Video" name="">
					<img src="//via.placeholder.com/500x500?text=Place+Image+Here" alt="Featured Image" class="fullWidth">
				</a>
			</div>
		</div>
	</div>
</body>
</html>