var x=0;
function move()
{       

    var pic=document.getElementById("pic");
    x=x+10;
    var pat=(x==700)? x=0:pic.style.left=x+"px";
}
<button onClick="move()"></button>
<img src=id="pic">

pic의 x좌표축 증가하다, 한계점(700)에 도달하면 다시감소 하다가 처음 위치(0)에 도달하면 다시증가를 반복하려고 하는데 어떤식으로 써야하나요ㅜㅜ?