Jquery slider with parallax scrolling (lightSlider+Parallax.js)

Question

I'm frustating 2 days just wanna make slider with parallax scrolling, the first I use bootstrap with parallax.js but seems more complicated, since parallax.js cannot integrate with <img src> it uses div <div class="parallax-window" data-parallax="scroll" data-image-src="/path/to/image.jpg"></div>, and bootstrap carousel use <img src>.

So I use lightslider with parallax.js but I got the same, the slider and parallax seems running but the slider wont change the picture, can someone help me please?

Here's my code

<div class="item">
        <ul id="content-slider" class="content-slider">
            <li>
               <div class="parallax-window" data-parallax="scroll" data-image-src="../images/bg1.jpg"></div>
            </li>
            <li>
               <div class="parallax-window" data-parallax="scroll" data-image-src="../images/bg2.jpg"></div>
            </li>
            <li>
             <div class="parallax-window" data-parallax="scroll" data-image-src="../images/bg3.jpg"></div>
            </li>

        </ul>
    </div>

Here my source

<!--slider -->
    <link type="text/css" rel="stylesheet" href="css/lightslider.css" />                  
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/lightslider.js"></script>
  <script src="js/parallax.min.js"></script>
<script>
       $(document).ready(function() {
      $("#content-slider").lightSlider({
                loop:true,
                 item:1,
                keyPress:true
            });

    </script>

I use http://pixelcog.github.io/parallax.js/ and http://sachinchoolur.github.io/lightslider/