Jquery-tubular plugin issue

Question

I'm trying to make my first video background and found this tubular plugin. when i follow the step, it seems that adding the code in body gets complicated. I added the jquery link and for some reason the code i added is not valid. can anyone help me how tomake this plugin work?

This is the instruction im trying to follow: https://code.google.com/p/jquery-tubular/

Thank you in advance!

here is my code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Using Tubular Plugin</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"         type="text/javascript"></script>
<script type="text/javascript" charset="utf-8" src="js/jquery.tubular.1.0.js"></script>
<style type="text/css">
body,html { margin:0; padding::0; height:100%; width:100%;}
#topSection {
background-color: #D8D8D8;
height:100%;
min-height:100%;
width:100&;
position:relative;

}
</style>
</head>
<body>
 $().ready(function() {
            $('#wrapper').tubular({videoId: 'idOfYourVideo'}); // where idOfYourVideo is the YouTube ID.
    });
<section id="topSection">Top section- I need a youtube video background     here</section>
</body>
</html>

what errors do you get in your browser javascript console (developer tools) — Offbeatmammal, Jan 29 '15 at 02:56
no error sir. its just showing the javascript like a text in html. — akoito, Jan 30 '15 at 17:23
that's because you don't have `` around the javascript to tell the browser it's script not text — Offbeatmammal, Jan 30 '15 at 18:24

score 0 · Answer 1 · answered Mar 19 '15 at 11:30

Hi Have you tryed calling jQuery from head. You should add a piece of code like:

<script>
$("document").ready(function() {
  var options = {  videoId: "xp-8HysWkxw", // where idOfYourVideo is the YouTube ID.
                   start: 0, 
                   repeat: true
                };    
$("#page").tubular(options); // Here is the jQuery call
});
</script>

Jquery-tubular plugin issue

1 Answers1