慕课网

信息滚动效果制作

最热最新

zuoyekun 03:32

<marquee>知识点

查看全部

0 采集收起来源：marquee标签实现信息滚动
2018-03-22
黄志明

setInterval clearInterval

查看全部

0 采集收起来源：间歇性滚动原理
2016-04-06
xs_wang

scrollHeight：元素的 padding 加 content 的高度。 clientWidth: 获取对象可见内容的宽度，不包括滚动条，不包括边框； clientHeight: 获取对象可见内容的高度，不包括滚动条，不包括边框；

查看全部

0 采集收起来源：间歇性循环滚动制作
2016-04-04
xs_wang

area.innerHTML += area.innerHTML; // 克隆 area 中的内容

查看全部

0 采集收起来源：单次滚动制作
2016-04-04
xs_wang

innerHTML：标签里的内容（含子标签）

查看全部

0 采集收起来源：练习题
2016-04-04
xs_wang

scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 (即网页被卷去的高) （是一个数值）

查看全部

0 采集收起来源：练习题
2016-04-05
xs_wang

offsetWidth、offsetHeight 不算 margin（content + padding + border） offsetLeft、offsetTop 从 border 算起

查看全部

0 采集收起来源：无缝滚动制作
2016-04-04
昵称好麻烦 04:16

dan hang gun dong

查看全部

0 采集收起来源：单次滚动制作
2016-04-03
桥风L

<script type="text/javascript"> var moocBox=document.getElementById("moocBox"); var con1=document.getElementById("con1"); var con2=document.getElementById("con2"); moocBox.scrollTop=0;//scrollTop的对象是div块级 con2.innerHTML=con1.innerHTML; function scrollup(){ if(moocBox.scrollTop==con1.offsetHeight){ moocBox.scrollTop=0; }else{ moocBox.scrollTop++;} } var timer=setInterval("scrollup()",50); moocBox.onmouseover=function(){ clearInterval(timer); } moocBox.onmouseout=function(){ timer=setInterval("scrollup()",50); } </script>

查看全部

0 采集收起来源：无缝滚动制作
2018-03-22
风233 03:27

<marqueen>HTML5已经弃用！

查看全部

0 采集收起来源：marquee标签实现信息滚动
2018-03-22
好笑 07:26

<script type="text/javascript"> var moocBox=document.getElementById("moocBox"); moocBox.scrollTop=0; moocBox.innerHTML+=moocBox.innerHTML;//进过添加内容功能，会改变元素的内容，元素的内容地址需要重新获取 var timer1=null; var timer=null; var oliHeight=24;//直接定义滚动高度，比获取行高度简单得多 var speed=50; var ispeed=500; function scrollUp(){ var con1=document.getElementsByTagName("ul")[0]; var moocBox=document.getElementById("moocBox"); if(moocBox.scrollTop%oliHeight==0){ clearInterval(timer); timer1=setTimeout(ostop,ispeed); } else { if(moocBox.scrollTop>=moocBox.scrollHeight/2){//计算方式：scrollHeight = topPadding + bottomPadding + 内容margix box的高度。 moocBox.scrollTop=0; } else{ moocBox.scrollTop++;} } } timer1=setTimeout(ostop,ispeed); function ostop(){ moocBox.scrollTop ++; timer = setInterval("scrollUp()",speed); } moocBox.onmouseover = function(){ clearInterval(timer); clearTimeout(timer1) } moocBox.onmouseout = function(){ timer = setInterval("scrollUp()",50); } </script>

查看全部

0 采集收起来源：间歇性循环滚动制作
2018-03-22
好笑

<script type="text/javascript"> var moocBox=document.getElementById("moocBox"); moocBox.scrollTop=0; moocBox.innerHTML+=moocBox.innerHTML;//进过添加内容功能，会改变元素的内容，元素的内容地址需要重新获取 var timer1=null; function scrollUp(){ var con1=document.getElementsByTagName("ul")[0];//改变内容后再获取元素地址 if(moocBox.scrollTop%24==0&&moocBox.scrollTop<con1.offsetHeight){//con1.scrollHeight和con1.offsetHeight都可以 clearInterval(timer); timer1=setTimeout(ostop,500); } else if(moocBox.scrollTop>=con1.offsetHeight){ moocBox.scrollTop=0; } else{ moocBox.scrollTop++;} } var timer=setInterval("scrollUp()",50); function ostop(){ moocBox.scrollTop ++; timer = setInterval("scrollUp()",50); } moocBox.onmouseover = function(){ clearInterval(timer); clearTimeout(timer1);//两种定时都要清除，不然会出现速度加快 } moocBox.onmouseout = function(){ timer = setInterval("scrollUp()",50); } </script>

查看全部

0 采集收起来源：单次滚动制作
2018-03-22
好笑

先完成滚动再添加鼠标事件

查看全部

0 采集收起来源：鼠标悬停事件添加
2016-03-30
好笑 07:37

使用两个板块流动，流动完了进行复位

查看全部

0 采集收起来源：无缝滚动制作
2016-03-30
好笑 02:44

<script type="text/javascript"> var moocBox=document.getElementById("moocBox"); var con1=document.getElementById("con1"); var con2=document.getElementById("con2"); moocBox.scrollTop=0;//scrollTop的对象是div块级 con2.innerHTML=con1.innerHTML; function scrollup(){ if(moocBox.scrollTop==con1.offsetHeight){ moocBox.scrollTop=0; }else{ moocBox.scrollTop++;} } var timer=setInterval("scrollup()",50); moocBox.onmouseover=function(){ clearInterval(timer); } moocBox.onmouseout=function(){ timer=setInterval("scrollup()",50); } </script>

查看全部

0 采集收起来源：无缝滚动制作
2018-03-22

首页上一页 29 30 31 32 33 34 35 下一页尾页

0/150

提交

取消

该课程已下架

课程须知: 1.您至少具备HTML/CSS基础知识； 2.您至少具备JavaSript基础知识；

老师告诉你能学到什么？: 1.学会<marquee>标签及属性，制作简单信息滚动。 2.掌握无缝滚动原理，运用JavaScript实现效果。 3.通过设定定时时间，实现间歇性无缝滚动。