不使用插件我想在我的图像滑块中插入滑动

Question

var click=0;
$(document).ready(function(){
 $('.nav-next').click(function(e) {
   
   if(click==3){
         e.preventDefault();
        $('#innerscroll,#innerscroll2,#innerscroll3,#innerscroll4,#innerscroll5,#innerscroll6').animate({
            'margin-left' : '600px'    
        });
 }
 else{
   e.preventDefault();
        $('#innerscroll,#innerscroll2,#innerscroll3,#innerscroll4,#innerscroll5,#innerscroll6').animate({
            'margin-left' : '+=200px'    
        });
   click++;
 }
    });
 
 
 
    $('.nav-previous').click(function(e) {
      if(click==3){
        e.preventDefault();
        $('#innerscroll,#innerscroll2,#innerscroll3,#innerscroll4,#innerscroll5,#innerscroll6').animate({
            'margin-left' : '10px'
        });
      }
      
      else{
         e.preventDefault();
        $('#innerscroll,#innerscroll2,#innerscroll3,#innerscroll4,#innerscroll5,#innerscroll6').animate({
            'margin-left' : '-=200px'
        });
        click++; 
      }
    });
    
    

* {
    margin: 0;
    padding: 0;
}

.full_width{
    display: block;
    width: 100%;
}
.full_width.language_header{
    height: 50px;
    background-color:#000;
}

.wrapper{
    margin: 0 auto;
    max-width: 1125px;
    width: 100%;
}

.main_content{
        display: block;
	width:100%;
	float:left;
}

.hold {
   margin: 10px;
   position: relative;
   background: #eee;       
   height: 250px;
   overflow:hidden; 
}
#innerscroll {
   position: absolute;
   background: #fff;
   left: 32%;
   height: 30px;
   width: 30px;
}

#innerscroll2 {
   position: absolute;
   background: #fff;
   left: 55%;
   height: 30px;
   width: 30px;
}

#innerscroll3 {
   position: absolute;
   background: #fff;
   left: 77%;
   height: 30px;
   width: 30px;
}

#innerscroll4 {
   position: absolute;
   background: #fff;
   left: 10%;
   height: 30px;
   width: 30px;
}

#innerscroll5{
    position: absolute;
   background: #fff;
   left: -129px;
   height: 30px;
   width: 30px;
}

#innerscroll6{
    position: absolute;
   background: #fff;
   left: -375px;
   height: 30px;
   width: 30px;
}

<div class="full_width slider_header">
  <div class="wrapper">
    <div class="main_content">
    

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div class="hold">
    <div id="innerscroll">
        <h3>Testing</h3>
        <img src="http://surfpk.com/wp-content/uploads/2012/03/iPad-3-Wallpaper-Nature-hd-1-300x300.jpg"/>
    </div>
    
    <div id="innerscroll2">
        <h3>Testing</h3>
        <img src="http://surfpk.com/wp-content/uploads/2012/03/iPad3-Wallpaper-Nature-7-300x300.jpg"/>
    </div>
    
    <div id="innerscroll3">
        <h3>Testing</h3>
        <img src="http://www.vivaboo.com/wp-content/uploads/2011/04/Day-end-Carbrook-Queensland-AU-Australia-cloud-tree-nature-300x300.jpg"/>
    </div>
    
    <div id="innerscroll4">
        <h3>Testing</h3>
        <img src="http://i1.sndcdn.com/artworks-000069726210-15ndu2-original.jpg?e30f094"/>
    </div>
    
    <div id="innerscroll5">
        <h3>Testing</h3>
        <img src="http://www.beh4you.ir/wp-content/uploads/2013/07/Amazing-Nature-11-300x300.jpg"/>
    </div>
    
    
    <div id="innerscroll6">
        <h3>Testing</h3>
        <img src="http://www.gizmocrazed.com/wp-content/uploads/2013/03/mushrooms.jpg"/>
    </div>
    
</div>

<button class="nav-previous">Previous</button>
<button class="nav-next">Next</button>
      
      </div></div></div>

这是我的滑块代码。它作为一个图像滑块不能自动使用prev和next按钮。不幸的是它现在在js小提琴中不起作用。 问题是我想在这个滑块中添加滑动效果，而不使用任何jquery插件，它适用于触摸屏mobiles.move图像向右和向左使用手指。

我是这个领域的初学者。请帮助。