title: Disable clicking on the play button in video carousel
body: <p>![enter image description here][1]At the moment i can click on any video in the carousal and it will appear in the iframe , where i am just taking the src of the video. I wanted to know if there a way to stop allowing the user to play the video when its in the carousal, but only play when the video is inside the iframe. </p>
  
  <pre><code>&lt;div class="row"&gt;
  &lt;div class="main"&gt;
      &lt;iframe width="600" height="480" id="mainvideo" src="https://www.youtube.com/embed/DU6UV2GPzIk?" style="margin: 30px auto 10px;float: none;display: block;" src="" frameBorder="0" allowfullscreen=""&gt;&lt;/iframe&gt;
  
      &lt;div id="owl-demo" class="owl-carousel"&gt;
  
          &lt;div class="article-video red" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/DU6UV2GPzIk?"&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/2ZfqGr7HbEo?"&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/053yP1wQR_s?"&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/B-QIFAy6LPI?"&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/4_ZRUC0g1ic?"&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/YU6AU-khKuo?"&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/Bkz5wyb_6j8?"&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/f1kx4Bce6nI?"&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/1HTq4F_js2g?"&gt;&lt;/a&gt;&lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>This is the Jquery code  i am using to change the video in the IFrame. </p>
  
  <pre><code>   $(document).ready(function(){
      $(".article-video").click(function(e) {
          e.preventDefault();
          var href= $(this).find('a').attr('href');
          var target = $('.article-video').index($(this));
          $("#mainvideo").attr("src", href);
  
      })
  });
  </code></pre>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
  
          var owl = $('.owl-carousel');
          owl.owlCarousel({
              items:4,
              margin:20,
              loop:true,
              video:true,
              lazyLoad:true,
              dots:false,
              responsive:{
                  0:{
                      items:1
                  },
  
                  678:{
                      items:3
                  },
                  1000:{
                      items:4
                  }
              },
              nav:true,
              navText: [
                  "&lt;i class='icon-chevron-left icon-white'&gt;&lt;&lt;/i&gt;",
                  "&lt;i class='icon-chevron-right icon-white'&gt;&gt;&lt;/i&gt;"
              ]
  
          });
      });
  
  $(document).ready(function(){
          $(".article-video").click(function(e) {
              e.preventDefault();
              var href= $(this).find('a').attr('href');
              var target = $('.article-video').index($(this));
              $("#mainvideo").attr("src", href);
  
          })
      });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;link rel="stylesheet" href="http://www.jackpotjoy.com/promo/responsive_templates/Test/assets/css/demo.css"&gt;
      &lt;link rel="stylesheet" href="http://www.jackpotjoy.com/promo/responsive_templates/Test/owlcarousel/owl.carousel.css"&gt;
      &lt;link rel="stylesheet" href="http://www.jackpotjoy.com/promo/responsive_templates/Test/owlcarousel/owl.theme.css"&gt;
  
  &lt;div class="row"&gt;
      &lt;div class="main"&gt;
          &lt;iframe width="600" height="480" id="mainvideo" src="https://www.youtube.com/embed/DU6UV2GPzIk?" style="margin: 30px auto 10px;float: none;display: block;" src="" frameBorder="0" allowfullscreen=""&gt;&lt;/iframe&gt;
  
          &lt;div id="owl-demo" class="owl-carousel"&gt;
  
              &lt;div class="article-video red" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/DU6UV2GPzIk?controls=0"&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/2ZfqGr7HbEo?controls=0"&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/053yP1wQR_s?controls=0"&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/B-QIFAy6LPI?controls=0"&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/4_ZRUC0g1ic?"&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/YU6AU-khKuo?"&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/Bkz5wyb_6j8?"&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/f1kx4Bce6nI?"&gt;&lt;/a&gt;&lt;/div&gt;
              &lt;div class="article-video" data-merge="2"&gt;&lt;a class="owl-video" href="https://www.youtube.com/embed/1HTq4F_js2g?"&gt;&lt;/a&gt;&lt;/div&gt;
  
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  
  &lt;script src="http://www.jackpotjoy.com/promo/responsive_templates/Test/assets/js/jquery-1.11.0.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://www.jackpotjoy.com/promo/responsive_templates/Test/owlcarousel/owl.carousel.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>