var content=document.getElementById('content');
var length=$('#list li').length;
var li_width=100;
var scrollIndex=0
$("#pre").click(function(){
if((length-Math.abs(scrollIndex))*li_width>=content.clientWidth) scrollIndex--;
transform(scrollIndex,li_width)
})
$("#next").click(function(){
if(scrollIndex<0) scrollIndex++;
transform(scrollIndex,li_width)
});
function transform(index,dept){
var ul =document.getElementById('list');
if(typeof(ul.style['transform'])==="undefined"){
ul.style.marginLeft=dept*index+'px'
}
else ul.style['transform']="translate3d("+dept*index+"px, 0px, 0px)";
}