JS Seamless scrolling in HTML

Marquee Picture Seamless scrolling
 Let's look at some of the properties of an object:

InnerHTML: Sets or gets the HTML that is inside the object's start and end tags
scrollheight: Gets the scroll height of the object. 
scrollleft: Sets or gets the distance between the left edge of the object and the leftmost of the currently visible content in the window
scrolltop: Sets or gets the distance between the top of the object and the top of the visible content in the window
scrollwidth: Gets the scrolling width of the object
offsetheight: Gets the height of the object relative to the layout or parent coordinates specified by the parent coordinate OffsetParent property
offsetleft: Gets the calculated left position of the object relative to the layout or the parent coordinate specified by the OffsetParent property
OffsetTop: Gets the computed top position of the object relative to the layout or the parent coordinate specified by the OffsetTop property
offsetwidth: Gets the width of the object relative to the layout or the parent coordinate specified by the parent coordinate OffsetParent property






<styletype= "Text/css"><!--#demo{background:#FFF;Overflow:Hidden;Border:1px dashed #CCC;Height:100px;text-align:Center;float: Left;}#demo img{Border:3px Solid #F2F2F2;Display:Block;} -</style>Scroll up<DivID= "Demo"><DivID= "Demo1"><ahref="#"><imgsrc= "Http://www.chaofan.biz/Clear_logo.gif"Border= "0" /></a><ahref="#"><imgsrc= "Http://www.chaofan.biz/Clear_logo.gif"Border= "0" /></a><ahref="#"><imgsrc= "Http://www.chaofan.biz/Clear_logo.gif"Border= "0" /></a><ahref="#"><imgsrc= "Http://www.chaofan.biz/Clear_logo.gif"Border= "0" /></a><ahref="#"><imgsrc= "Http://www.chaofan.biz/Clear_logo.gif"Border= "0" /></a></Div><DivID= "Demo2"></Div></Div><Script><!--var Speed=Ten; //The higher the number, the slower the speed .varTab=document.getElementById ("Demo");varTAB1=document.getElementById ("Demo1");vartab2=document.getElementById ("Demo2"); tab2.innerhtml=tab1.innerhtml;//clone demo1 to Demo2functionMarquee () {if(Tab2.offsettop-Tab.scrolltop<=0)//When scrolling to the junction of Demo1 and Demo2Tab.scrolltop-=Tab1.offsetheight//demo jumps to the topElse{tab.scrolltop++}}varMyMar=setinterval (marquee,speed); Tab.onmouseover=function() {clearinterval (MyMar)};//when the mouse moves over, the removal timer reaches the end of the scrolling stopTab.onmouseout=function() {MyMar=setinterval (Marquee,speed)};//Reset timer When mouse is moved off -</Script>

Scroll Right

<MARQUEEBehavior= "Scroll"contenteditable= "true"OnStart= "this.firstchild.innerhtml+=this.firstchild.innerhtml;"ScrollAmount= "3"width= "+"><SPANunselectable= "On"></SPAN></MARQUEE><DIVID= "Scrollobj"style= "white-space:nowrap;overflow:hidden;width:500px;"onmouseover= "AA ()"onmouseout= "B ()" >[CROSSSELLING3][CROSSSELLING4][CROSSSELLING5][CROSSSELLING6][CROSSSELLING7][CROSSSELLING8][CROSSSELLING9] [CROSSSELLING10]</DIV><Scriptlanguage= "JavaScript"type= "Text/javascript"><!--    functionScroll (obj) {vartmp=(Obj.scrollleft)++; //When the scroll bar reaches the top right        if(Obj.scrollleft==tmp) obj.innerhtml+=obj.innerhtml; //scroll bar back to leftmost when scroll bar scrolls the width of initial content        if(Obj.scrollleft>=obj.firstChild.offsetWidth) Obj.scrollleft=0; }    vara=SetInterval ("Scroll (document.getElementById (' scrollobj '))", -); functionAA () {clearinterval (a); }    functionB () {a=SetInterval ("Scroll (document.getElementById (' scrollobj '))",Ten); }// -</Script>

JS Seamless scrolling in HTML