JavaScript to achieve vertical upward seamless scrolling effect code _javascript tips

A circular upward scrolling text, such as the scrolling effect above

Second, the realization of the idea

1, the establishment of three layers Dome, dome1, dome2
2, vertical scrolling text on the dome1
3, through the layer of scrolling to achieve text scrolling

Third, the source code

Iv. set the div source code for the layer with ID dome

#dome {
overflow:hidden/* Overflow part does not show
/height:180px;
padding:5px;
}

Implementation of the loop up-scrolling JavaScript code

function $ (Element) {return
document.getElementById (element);
}
var dome=$ ("Dome");
var dome1=$ ("dome1");
var dome2=$ ("Dome2");
var speed=50; Set up scrolling speed
dome2.innerhtml=dome1.innerhtml//copy dome1 for dome2
function movetop () {
if ( dome2.offsettop-dome.scrolltop<=0)///when scrolling to dome1 and dome2
dome.scrolltop-=dome1.offsetheight//dome jumps to the top
else{
dome.scrolltop++
}
}
var mymar=setinterval (movetop,speed)/Set Timer
Dome.onmouseover=function () {clearinterval (MyMar)}///////////////////////////////
SetInterval (Movetop,speed)}//reset timer When mouse moves, continue scrolling

Above this javascript to achieve vertical upward seamless scrolling effect code is a small series to share all the content, hope to give you a reference, but also hope that we support the cloud habitat community.