<!DOCTYPE HTML><HTML><Head> <title>scrolling Pictures</title> <styletype= "Text/css">. Imagebox{Height:438px;width:960px;Overflow:Hidden;position:relative;margin:Auto; }. Scrollcontainer{width:4800px;Height:438px;padding:0px;position:Absolute;Top:0px; Left:0px; }. Scrollimg{width:960px;Height:435px; }. Scrollcontainer Li{float: Left;Display:List-item; }. Content{margin:Auto; } </style> <MetaCharSet= "Utf-8" /> <Scripttype= "Text/javascript"src= "Jquery-3.1.1.min.js"></Script></Head><Body> <Divclass= "Content"> <Divclass= "Imagebox"> <ulclass= "Scrollcontainer"> <Li> <imgclass= "Scrollimg"src= "Http://www.gettyimagesgallery.com/Images/services/ph_01.jpg" /> </Li> <Li> <imgclass= "Scrollimg"src= "Http://www.gettyimagesgallery.com/Images/services/ph_02.jpg" /> </Li> <Li> <imgclass= "Scrollimg"src= "Http://www.gettyimagesgallery.com/Images/services/ph_03.jpg" /> </Li> <Li> <imgclass= "Scrollimg"src= "Http://www.gettyimagesgallery.com/Images/services/ph_04.jpg" /> </Li> <Li> <imgclass= "Scrollimg"src= "Http://www.gettyimagesgallery.com/Images/services/ph_01.jpg" /> </Li> </ul> </Div> </Div> <Scripttype= "Text/javascript"> varBasenum= 960; varImgnum= 5, Initnum= 0; varinterval=SetInterval (function(){ if(Initnum==imgnum) {Initnum= 0; $(". Scrollcontainer"). css ({"marginleft" : "0px"}); } $(". Scrollcontainer"). Animate ({"marginleft": -Basenum*Initnum+ "px"}, the); Initnum++; }, -); </Script></Body></HTML>
Rolling carousel effect,. NET no mix-up seems to be the only way to write JS