Search code examples
jquerycolorbox

Color Box for youtube

I am using color box plugin to embed youtube videos but it doesn't seem to work. see my code below which is very basic. $(document).ready(function(){ $('.youtube').colorbox({iframe:true, innerWidth:640, innerHeight:390});

Then the code that opens the ovelay;

<p><a class="youtube" href="http://www.youtube.com/watch?v=0sRXkKe9SJk">Test Video</a></p>

When i replace the code above with the demo link and code, it works just fine. The code below works. <p><a class="youtube" href=" http://www.youtube.com/v/VOJyrQa_WR4?rel=0&amp;wmode=transparent">Test Video</a></p>

What am i missing?

Solution

  • Try this:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="path/to/jquery.colorbox.js"></script>
<link rel="stylesheet" href="path/to/colorbox.css" />
<script>
$(document).ready(function(){
    $(".youtube").colorbox({iframe:true, innerWidth:640, innerHeight:390});
});
</script>

<p><a class='youtube' href="http://www.youtube.com/v/0sRXkKe9SJk?rel=0&amp;wmode=transparent">Play My Video</a></p>