Skip to content

Instantly share code, notes, and snippets.

@subhashdasyam

subhashdasyam/index.html

Created March 31, 2017 13:57
Show Gist options
  • Save subhashdasyam/09e0fd5e41e1c9f2b21a3174f04df1bd to your computer and use it in GitHub Desktop.
Save subhashdasyam/09e0fd5e41e1c9f2b21a3174f04df1bd to your computer and use it in GitHub Desktop.
Download ZIP
The HTML
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<meta charset=utf-8 />
<title>Youtube Embed</title>
<style>
.youtube-popup {
position: relative;
width: 560px; /* equal to the iframe width */
height: 315px; /* equal to the iframe height */
}
.youtube-popup > div {
position: absolute;
width: 560px; /* equal to the iframe width */
height: 315px; /* equal to the iframe height */
top: 0;
z-index: 100;
}
</style>
</head>
<body>
<div class="youtube-popup">
<iframe width="560" height="315" src="http://www.youtube.com/embed/uqS0KnmXXiY" frameborder="0" allowfullscreen></iframe>
<div></div>
</div>
<script type="text/javascript">
$( document ).ready(function() {
$('.youtube-popup > div').click(function(){
window.open($(this).parent().children('iframe').attr("src"));
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment