div CSS 레이아웃 그림 연속 스크롤 js 구현 code_javascript 기술

html 레이아웃 코드

코드 복사 코드는 다음과 같습니다.

<스크립트>
toleft("demo","demo1","demo2",30,"onedemo");
//toright("demo0","demo11","demo22",20,"ti2");

js核心代码

复主代码 代码如下:

//调用向左滚动
//toleft("demo","demo1","demo2",30,"ti1")
//调用向右滚动
//toright("demo0" ,"demo11","demo22",20,"ti2")

함수 $(id)
{
return document.getElementById(id)
}

//向左滚动函数，demo包含demo1与demo2,speed是滚动速島，flag一个网页内有多个时设置为不同任意字符。
function toleft(demo,demo1,demo2,speed,flag)
{
데모=$(데모);
데모1=$(데모1);
demo2=$(demo2)
demo2.innerHTML=demo1.innerHTML
function Marquee()
{
if(demo2.offsetWidth-demo.scrollLeft<=0)
{
demo.scrollLeft-=demo1.offsetWidth
}
else
{
demo.scrollLeft
}
}
flag=setInterval(Marquee,speed)
demo.onmouseover=function()
{
clearInterval(flag);
}
demo.onmouseout=function()
{
flag=setInterval(Marquee,speed);
}
}


//向右滚动函数,demo包含demo1与demo2,speed是滚动速島,flag一个网页内有多个时设置为为不同的任意字符。
right(demo,demo1,demo2,speed,flag) 함수
{
demo=$(demo);
데모1=$(데모1);
demo2=$(demo2)
demo2.innerHTML=demo1.innerHTML
function Marquee()
{
if(demo.scrollLeft<=0)
{
demo .scrollLeft=demo2.offsetWidth
}
else
{
demo.scrollLeft--
}
}
flag=setInterval(Marquee,speed)
demo. onmouseover=function()
{
clearInterval(플래그);
}
demo.onmouseout=function()
{
flag=setInterval(Marquee,speed);
}
}

더 많은 기능이 필요하시면 다음 내용을 참고하세요:
JavaScript 4방향 그림 스크롤 효과
JavaScript 원활한 위, 아래, 왼쪽, 오른쪽 스크롤 및 고정 높이 및 고정 너비 일시 정지 효과(ie/ff와 호환 가능)