慕课网

信息滚动效果制作

最热最新

WEYN

marquee标签知识普及： direction: 滚动方向. loop: 滚动循环次数. behavior: 滚动的行为. scrollamount: 滚动的速度.

查看全部

0 采集收起来源：练习题
2017-12-30
Nirva_Troy 03:31

<marquee>知识点默认向左滚动 behavior 滚动方式 alternate 两端之间来回滚动； scroll 一段滚动到另一端会重复； slide 表示由一段滚动到另一端，不会重复 direction 滚动的方向 down、up、left、right loop 滚动的次数默认-1 无限循环 scrollamount 设定滚动速度 scrolldelay 设定两次滚动之间的延迟时间

查看全部

0 采集收起来源：marquee标签实现信息滚动
2018-03-22
慕瓜5189485

div{ width:200px; height:200px; border:1px solid #f00; margin:0 auto; margin-top:200px; overflow:hidden; } li{ list-style-type:none; height:24px; line-height:24px; font-size:14px; } <div id="box"> <ul id="con1"> <li>woshi1</li> <li>woshi2</li> <li>woshi3</li> <li>woshi4</li> <li>woshi5</li> <li>woshi6</li> <li>woshi7</li> <li>woshi8</li> <li>woshi9</li> </ul> <ul id="con2"></ul> </div> var box = document.getElementById('box'), con1 = document.getElementById('con1'), con2 = document.getElementById('con2'); con2.innerHTML = con1.innerHTML; function scroll(){ if(box.scrollTop>=con1.offsetHeight){ box.scrollTop=0; }else{ box.scrollTop++; } } var time =50; setInterval("scroll()",time);

查看全部

0 采集收起来源：无缝滚动制作
2018-03-22
慕瓜5189485 03:30

marquee知识点

查看全部

0 采集收起来源：marquee标签实现信息滚动
2017-11-11
qq_骑着蜗牛上高速_1 03:30

marquee知识点

查看全部

0 采集收起来源：marquee标签实现信息滚动
2017-11-09
慕仙5237505 07:32

优化的：

查看全部

0 采集收起来源：间歇性循环滚动制作
2017-11-03
慕仙5237505 06:16

#mooc{ width:200px; height:160px; border:2px solid #f00; overflow:hidden; margin:200px auto auto auto; } #mooc ul li{ list-style-type:none; height:24px; line-height:24px; } <div id="mooc"> <ul > <li>woshi1</li> <li>woshi2</li> <li>woshi3</li> <li>woshi4</li> <li>woshi5</li> <li>woshi6</li> <li>woshi7</li> <li>woshi8</li> <li>woshi9</li> </ul> </div> var m=document.getElementById("mooc"); m.innerHTML+=m.innerHTML; m.scrollTop=0; //初始化 var liHeight=24; var time; function move(){ m.scrollTop++; time=setInterval(top1,50); } function top1(){ // m.scrollTop++; if(m.scrollTop % liHeight==0){ clearInterval(time); setTimeout("move()",5000); }else{ m.scrollTop++; if(m.scrollTop>=m.scrollHeight/2){ m.scrollTop=0; } } } setTimeout(move,2000);

查看全部

0 采集收起来源：间歇性循环滚动制作
2018-03-22
慕仙5237505 05:48

求指点scrolltop， scrollheigt关系 if(ar.scrollTOP >= ar.scrollheight/2){ar.scrolltop=0}问题1：这句代表什么意思啊？ 2：scrolltop 和 scrollheigth不是一个东西吗？scrolltop代表啥？ scrollheigth又代表什么？ 3 为啥不是ar.scrollheight=0 .xiexie大神

查看全部

0 采集收起来源：间歇性循环滚动制作
2018-03-22
慕仙5237505 06:49

js 下部分

查看全部

0 采集收起来源：间歇性循环滚动制作
2017-11-03
慕仙5237505 06:46

js上部分

查看全部

0 采集收起来源：间歇性循环滚动制作
2017-11-03
慕仙5237505 01:18

知识点：

查看全部

0 采集收起来源：间歇性循环滚动制作
2017-11-03
慕仙5237505

m.innerHTML+=m.innerHTML; 做克隆 2：m.scrollTop（滚动高度） % liHeight（一行li的高度）==0

查看全部

0 采集收起来源：单次滚动制作
2017-11-03
慕仙5237505 03:11

问题是：只走了一次 #mooc{ width:200px; height:160px; border:2px solid #f00; overflow:hidden; margin:200px auto auto auto; } #mooc ul li{ list-style-type:none; height:24px; line-height:24px; } <div id="mooc"> <ul > <li>woshi1</li> <li>woshi2</li> <li>woshi3</li> <li>woshi4</li> <li>woshi5</li> <li>woshi6</li> <li>woshi7</li> <li>woshi8</li> <li>woshi9</li> </ul> </div> var m=document.getElementById("mooc"); m.innerHTML+=m.innerHTML; m.scrollTop=0; //初始化 var liHeight=24; function top1(){ m.scrollTop++; if(m.scrollTop % liHeight==0){ clearInterval(time); } } var time=setInterval(top1,50);

查看全部

0 采集收起来源：单次滚动制作
2018-03-22
慕仙5237505 03:57

js调用

查看全部

0 采集收起来源：单次滚动制作
2017-11-03
慕仙5237505 03:05

html2

查看全部

0 采集收起来源：单次滚动制作
2017-11-03

首页上一页 1 2 3 4 5 6 7 下一页尾页

0/150

提交

取消

该课程已下架

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

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