I am trying to create a little client slide with javascript
.
What i have achieved so far is to move the images om button click.
Below is the code
HTML
<div class="client-slide">
<img src="images/oma.png">
<img src="images/pz.png">
<img src="images/tata.png">
<img src="images/mik.png">
<img src="images/may.png">
<img src="images/dang.png">
<img src="images/vita.png">
<img src="images/cap.png">
<img src="images/cla.png">
<img src="images/int.png">
</div>
<ul class="slideBtn">
<li><div class="leftButton"><i class="fa fa-angle-left"></i></div></li>
<li><div class="rightButton"><i class="fa fa-angle-right"></i></div></li>
</ul>
JavaScirpt
$(document).ready(function() {
$('.leftButton').click(function() {
$('.client-slide').animate({
'marginLeft' : "-=100px"
});
});
$('.rightButton').click(function() {
$('.client-slide').animate({
'marginLeft' : "+=100px"
});
});
});
Above code work when i click on the button. I want such that when i click on the button, the image in position one goes to the last position there by creating an infinite loop.
Thanks.