title: How to get transform value in owl carousel using jQuery?
body: <p>I am trying to get the transform value in owl carousel using jQuery. I tried a lot of code but I'm not getting the proper solution. Can anyone please help me?</p>
  
  <p>Here is the code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;Owl Carousel - Images Demo&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;meta name="description" content="jQuery Responsive Carousel - Owl Carusel"&gt;
      &lt;meta name="author" content="Bartosz Wojciechowski"&gt;
  
      &lt;link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,600,700' rel='stylesheet' type='text/css'&gt;
      &lt;link href="http://newtimes.ru/assets/css/bootstrapTheme.css" rel="stylesheet"&gt;
      &lt;link href="http://newtimes.ru/assets/css/custom.css" rel="stylesheet"&gt;
      &lt;!-- Owl Carousel Assets --&gt;
      &lt;link href="http://newtimes.ru/owl-carousel/owl.carousel.css" rel="stylesheet"&gt;
      &lt;link href="http://newtimes.ru/owl-carousel/owl.theme.css" rel="stylesheet"&gt;
      &lt;!-- Prettify --&gt;
      &lt;link href="http://newtimes.ru/assets/js/google-code-prettify/prettify.css" rel="stylesheet"&gt;
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" /&gt;
  &lt;!-- Optional theme --&gt;
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" /&gt;
      &lt;!-- Le fav and touch icons --&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="demo"&gt;
          &lt;div class="container"&gt;
            &lt;div class="row"&gt;
              &lt;div class="span12"&gt;
                &lt;div id="owl-demo" class="owl-carousel"&gt;
                  &lt;div class="item" data-rel="#dropdownmenu-1"&gt;1&lt;/div&gt;
                  &lt;div class="item" data-rel="#dropdownmenu-2"&gt;2&lt;/div&gt;
                  &lt;div class="item" data-rel="#dropdownmenu-3"&gt;3&lt;/div&gt;
                  &lt;div class="item" data-rel="#dropdownmenu-4"&gt;4&lt;/div&gt;
                  &lt;div class="item" data-rel="#dropdownmenu-1"&gt;5&lt;/div&gt;
                  &lt;div class="item" data-rel="#dropdownmenu-3"&gt;6&lt;/div&gt;
                  &lt;div class="item" data-rel="#dropdownmenu-2"&gt;7&lt;/div&gt;
                  &lt;div class="item" data-rel="#dropdownmenu-4"&gt;8&lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;script src="http://newtimes.ru/assets/js/jquery-1.9.1.min.js"&gt;&lt;/script&gt; 
      &lt;script src="http://newtimes.ru/owl-carousel/owl.carousel.js"&gt;&lt;/script&gt;
      &lt;!-- Demo --&gt;
      &lt;style&gt;
      #owl-demo .item{
          margin: 3px;
      }
      #owl-demo .item img{
          display: block;
          width: 100%;
          height: auto;
      }
      &lt;/style&gt;
  &lt;/div&gt;
      &lt;script&gt;
      $(document).ready(function() {
        $("#owl-demo").owlCarousel({
          autoPlay: 3000,
          items : 4,
          itemsDesktop : [1199,3],
          itemsDesktopSmall : [979,3]
        });
      });
  
      setTimeout(function(){
          $('#owl-demo .owl-wrapper').css({
              'transform': 'translate3d(0px, 0px, 0px)'
          });
      });
  
      $('#owl-demo .item').click(function(e) {
            var heightval= $(this).outerHeight();
             var posX = $(this).position().left,
             posY = $(this).position().top + heightval;
             $('.dropdown-menu').css({
                  'display':'none',
              }); 
              var transformtarget= $('#owl-demo .owl-wrapper');
              var transformval=  getTransform(transformtarget);
              alert(transformval);
      });
  
      function getTransform(el) {
      var results = $(el).css('transform').match(/matrix(?:(3d)\(\d+(?:, \d+)*(?:, (\d+))(?:, (\d+))(?:, (\d+)), \d+\)|\(\d+(?:, \d+)*(?:, (\d+))(?:, (\d+))\))/)
      if(!results) return [0, 0, 0];
      if(results[1] == '3d') return results.slice(2,5);
      results.push(0);
      return results.slice(5, 8);
  }
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Thanks.</p>