title: jquery mcustomscrollbar get the current item
body: <p>I have used mcustomscrollbar in my slider area. </p>
  
  <p>Please refer the url <a href="http://manos.malihu.gr/repository/custom-scrollbar/demo/examples/scrollTo_demo.html" rel="nofollow noreferrer">horizontal scroll example url here</a></p>
  
  <p>I used the horizontal scroll section <code>content x</code></p>
  
  <p>Below is the code I have used</p>
  
  <pre><code>        $(".selector").mCustomScrollbar({
                  axis:"x",
                  autoHideScrollbar:true,
                  alwaysShowScrollbar:0,
                  contentTouchScroll:true,
                  mouseWheel: false,
                  advanced:{autoExpandHorizontalScroll:true},
                  callbacks:{
                      onScroll:function(){
                          alert(this.mcs.leftPct); /// This is the scrol percentage
  
                      }
  
  
                  }
  
              });
  </code></pre>
  
  <p>Here it is working fine. My task is in the call back area I have got the scroll percentage. By using this how to get the current element no. i.e Initially the scroll percentage is 0 and the element is 0th andd 1st element is viewed. After I drag the scroll bar it moved to some position. At that time which element is in view port slider area. While scroll I want to get the current element, where the scroll bar is. </p>
  
  <p>Please help me to get this. If the scroll bar is below the 3rd element, I want to retrieve the element number. </p>
  
  <p><strong>To get the element no, I used the following:</strong></p>
  
  <pre><code>var tot_item_count = 12;                            
  var elm_no = Math.round((tot_item_count*this.mcs.leftPct)/100);
  </code></pre>
  
  <p>But it gives wrong result</p>
  
  <p>Refer screen shots:
  Here the scroll for all images
  <img src="https://i.stack.imgur.com/R0z5z.png" alt="enter image description here"></p>
  
  <p>Here the scroll is near the 3rd element 
  <img src="https://i.stack.imgur.com/kqFmo.png" alt="enter image description here"></p>
  
  <p>Here the scroll is near the 5rd element 
  <img src="https://i.stack.imgur.com/ymrJ1.png" alt="enter image description here"></p>