joshorvis/dynamically_resize_javascript_inline_player.html

## dynamically_resize_javascript_inline_player.html
<html>
    <head>
        <style type="text/css">
            .video_container {
                position: relative;
                /* Set max values to player size */
                max-width: 640px;
                max-height: 360px;
                display:block;
            }
            .vidyard_player > span {
                width: 100% !important;
                height: 100% !important;
                max-width: 640px;
                max-height: 360px;
            }
        </style>
        <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
        <script type="text/javascript">
            $(window).on('load resize',function(){
                $(".video_container").each (function (index) {
                    // Maintain 16:9 aspect ratio
                    $(this).height($(this).width()*(9/16));
                });
            });
        </script>
    </head>
    <body>
        <div class="video_container">
            <!-- Vidyard inline Javascript embed here -->
        </div>
    </body>
</html>
	<html>
	<head>
	<style type="text/css">
	.video_container {
	position: relative;
	/* Set max values to player size */
	max-width: 640px;
	max-height: 360px;
	display:block;
	}
	.vidyard_player > span {
	width: 100% !important;
	height: 100% !important;
	max-width: 640px;
	max-height: 360px;
	}
	</style>
	<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
	<script type="text/javascript">
	$(window).on('load resize',function(){
	$(".video_container").each (function (index) {
	// Maintain 16:9 aspect ratio
	$(this).height($(this).width()*(9/16));
	});
	});
	</script>
	</head>
	<body>
	<div class="video_container">
	<!-- Vidyard inline Javascript embed here -->
	</div>
	</body>
	</html>