How can i prevent horizental scrolling in mobile view when div move with jquery

i wrote some code to simulate papers for each page of my website but when you view it on gadget(mobile) devices when a div move(translateX) left screen scoll automatically with div to left then came back.

var width = divs.eq(currentDiv).width()+100;
$(".books-pages").css("transform" , "rotate(0)");
$(".main-menu").parent().css("transform" , "translateX("+width+"px)");
var menu = $(".main-menu").clone();
$("."+id).css("transform" , "translateX("+-width+"px)");

how can i prevent this scrolling?