Skip to content

Instantly share code, notes, and snippets.

@cpoDesign
Created April 4, 2016 16:14
Show Gist options
  • Save cpoDesign/58aad10334915995620f1af19d20816e to your computer and use it in GitHub Desktop.
Save cpoDesign/58aad10334915995620f1af19d20816e to your computer and use it in GitHub Desktop.
vzaar video player example
<html>
<body>
<script src="https://code.jquery.com/jquery-1.12.2.min.js" integrity="sha256-lZFHibXzMHo3GGeehn1hudTAP3Sc0uKXBXAzHX1sjtk=" crossorigin="anonymous"></script>
<script>
function populateVideoElement(videoId) {
var dynamicName = 'vzvd-' + videoId;
var link = "https://view.vzaar.com/"+videoId +"/player";
var iframe = document.createElement('iframe');
iframe.frameBorder=0;
iframe.width="768px";
iframe.height="432px";
iframe.id=dynamicName;
iframe.setAttribute("src", link);
iframe.name = dynamicName;
iframe.title="vzaar video player";
iframe.class="vzaar-video-player"
iframe.type="text/html";
iframe.allowFullScreen="allowFullScreen"
iframe.allowTransparency="true";
iframe.mozallowfullscreen="mozallowfullscreen";
iframe.webkitAllowFullScreen="webkitAllowFullScreen";
$('#myLocation').html(iframe);
}
</script>
<div>
<button onclick="populateVideoElement(6724662)">6724662</button>
<button onclick="populateVideoElement(6724717)">6724717</button>
<button onclick="populateVideoElement(6724782)">6724782</button>
</div>
<div id="myLocation">
demo
</div>
<iframe id="vzvd-6724662" name="vzvd-6724662" title="vzaar video player" class="vzaar-video-player" type="text/html" width="768" height="432" frameborder="0" allowFullScreen allowTransparency="true" mozallowfullscreen webkitAllowFullScreen src="https://view.vzaar.com/6724662/player"></iframe>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment