慕课网

信息滚动效果制作

最热最新

梦编猿

@间歇性循环滚动制作 <script> var area=document.getElementById('moocBox'), delay=2000, speed=50, liHeight=24; area.innerHTML+=area.innerHTML; var timer; function startScroll(){ area.scrollTop++; timer=setInterval('scrollUp()',speed); } function scrollUp(){ if(area.scrollTop%liHeight==0){ clearInterval(timer); setTimeout('startScroll()',delay); }else{ area.scrollTop++; if (area.scrollTop>=area.scrollHeight/2) { area.scrollTop=0; } } } setTimeout('startScroll()',delay); </script> <body> <div id="moocBox"> <ul id="con1"> <li>...</li> . . . <li>...</li> </ul> </div> </body> 【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】

查看全部

0 采集收起来源：间歇性循环滚动制作
2018-03-22
梦编猿 01:27

克隆方法1： var con1 = document.getElementById('con1'), con2 = document.getElementById('con2'); con2.innerHTML = con1.innerHTML; 克隆方法2： var area = document.getElementById('moocBox'); area.innerHTML+=area.innerHTML; Ps1：setTimeout('函数或表达式',时间); Ps2：var iLiHeight=<li>的高度;//单行，若两行，则<li>的高度*2。 area.scrollTop%iLiHeight==0;//滚动的高度等于<li>高度。 Ps3：显示一行信息：显示区域的高度==<li>的高度。【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】

查看全部

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

@文字信息无缝滚动 <script> var area = document.getElementById('moocBox'), con1 = document.getElementById('con1'), con2 = document.getElementById('con2'); con2.innerHTML = con1.innerHTML; function scrollUp(){ if(area.scrollTop >= con1.offsetHeight){ area.scrollTop = 0; }else{ area.scrollTop++; } } var time = 50; var myScroll = setInterval('scrollUp()',time); //当鼠标移入时停止滚动 area.onmouseover = function(){ clearInterval(myScroll); } //当鼠标离开时继续滚动 area.onmouseout = function(){ myScroll = setInterval('scrollUp()',time); } </script> <body> <div id="moocBox"> <ul id="con1"> <li>...</li> . . . <li>...</li> </ul> <ul id="con2"></ul> </div> </body> 【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】

查看全部

0 采集收起来源：鼠标悬停事件添加
2018-03-22
梦编猿 10:10

<marquee></marquee>文字信息滚动标签。可以设置滚动方向、速度、时间。滚动方式：来回滚动，重复滚动和非重复滚动属性说明: 1.direction表示滚动的方向，值可以是left，right，up，down，默认为left 2.behavior表示滚动的方式，值可以是scroll（连续滚动）slide（滑动一次）alternate（往返滚动） 3.loop表示循环的次数，值是正整数，默认为无限循环 4.scrollamount表示运动速度，值是正整数，默认为6 5.scrolldelay表示停顿时间，值是正整数，默认为0，单位似乎是毫秒 6.align表示元素的垂直对齐方式，值可以是top，middle，bottom，默认为middle 7.bgcolor表示运动区域的背景色，值是16进制的RGB颜色，默认为白色 8.height、width表示运动区域的高度和宽度，值是正整数（单位是像素）或百分数，默认width=100% height为标签内元素的高度 9.hspace、vspace表示元素到区域边界的水平距离和垂直距离，值是正整数，单位是像素。 1o.onmouseover=this.stop();onmouseout=this.start()表示当鼠标以上区域的时候滚动停止，当鼠标移开的时候又继续滚动。【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】

查看全部

0 采集收起来源：marquee标签实现信息滚动
2018-03-22
梦编猿

<marquee></marquee>文字信息滚动标签。可以设置滚动方向、速度、时间。滚动方式：来回滚动，重复滚动和非重复滚动属性说明: 1.direction表示滚动的方向，值可以是left，right，up，down，默认为left 2.behavior表示滚动的方式，值可以是scroll（连续滚动）slide（滑动一次）alternate（往返滚动） 3.loop表示循环的次数，值是正整数，默认为无限循环 4.scrollamount表示运动速度，值是正整数，默认为6 5.scrolldelay表示停顿时间，值是正整数，默认为0，单位似乎是毫秒 6.align表示元素的垂直对齐方式，值可以是top，middle，bottom，默认为middle 7.bgcolor表示运动区域的背景色，值是16进制的RGB颜色，默认为白色 8.height、width表示运动区域的高度和宽度，值是正整数（单位是像素）或百分数，默认width=100% height为标签内元素的高度 9.hspace、vspace表示元素到区域边界的水平距离和垂直距离，值是正整数，单位是像素。 1o.onmouseover=this.stop();onmouseout=this.start()表示当鼠标以上区域的时候滚动停止，当鼠标移开的时候又继续滚动。【温馨提示：JavaSE/EE、SSH/SSM、Hybrid APP、JQ/JS/CSS3/H5等编程爱好者关注我，加我慕课好友，互相学习，共同进步！】

查看全部

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

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。 setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

查看全部

0 采集收起来源：练习题
2016-06-19
CMinC

间歇性循环滚动制作知识点 1、setTimeout（表达式，延迟时间）在执行时，是在载入后延迟指定时间后，去执行一次表达式，仅执行一次 2、setInterval()（表达式，交互时间）在执行时，它从载入后，每隔指定的时间就执行一次表达式 <script> var area = document.getElementById("moocBox"); var iLiHeight = 24; //滚动高度 area.innerHTML += area.innerHTML; //克隆area的内容到area area.scrollTop = 0; var speed = 50; var delay = 2000; var time; function startMove(){ area.scrollTop++; time = setInterval("scrollUp()",speed); } function scrollUp(){ if(area.scrollTop % iLiHeight == 0){ clearInterval(time); setTimeout("startMove()",delay); }else{ area.scrollTop++; if(area.scrollTop >= area.scrollHeight/2){ area.scrollTop = 0; } } } setTimeout("startMove()",delay); //初始化 </script> <body> <div id="moocBox"> <ul> <li>...</li> . . . <li>...</li> </ul> </div> </body>

查看全部

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

单次滚动制作 <script> var area = document.getElementById('moocBox'); var iLiHeight = 24; area.innerHTML += area.innerHTML; //克隆area的内容到area area.scrollTop = 0; function scrollUp(){ area.scrollTop++; if(area.scrollTop % iLiHeight == 0){ clearInterval(time); } } var time = setInterval("scrollUp()",50); </script> <body> <div id="moocBox"> <ul> <li>...</li> . . . <li>...</li> </ul> </div> </body>

查看全部

0 采集收起来源：单次滚动制作
2018-03-22
java家洼

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。 setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

查看全部

0 采集收起来源：练习题
2016-06-19
java家洼

滚动方式behavior: scroll:循环滚动，默认效果； slide:只滚动一次就停止； alternate:来回交替进行滚动语法：<marquee behavior="滚动方式">...</marquee> 滚动方向direction（包括4个值：up、 down、 left和 right）语法：<marquee direction="滚动方向">...</marquee> 滚动循环loop（默认值是-1，滚动会不断的循环下去）语法：<marquee loop="2">...</marquee> 动速度scrollamount（滚动速度是设置每次滚动时移动的长度，以像素为单位）语法：<marquee scrollamount="5">...</marquee>

查看全部

0 采集收起来源：练习题
2018-03-22
CMinC

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

查看全部

0 采集收起来源：练习题
2016-06-18
CMinC

鼠标悬停事件添加 <script> var area = document.getElementById('moocBox'), con1 = document.getElementById('con1'), con2 = document.getElementById('con2'); con2.innerHTML = con1.innerHTML; function scrollUp(){ if(area.scrollTop >= con1.offsetHeight){ area.scrollTop = 0; }else{ area.scrollTop++; } } var time = 50; var myScroll = setInterval('scrollUp()',time); //当鼠标移入时停止滚动 area.onmouseover = function(){ clearInterval(myScroll); } //当鼠标离开时继续滚动 area.onmouseout = function(){ myScroll = setInterval('scrollUp()',time); } </script> <body> <div id="moocBox"> <ul id="con1"> <li>...</li> . . . <li>...</li> </ul> <ul id="con2"></ul> </div> </body>

查看全部

0 采集收起来源：鼠标悬停事件添加
2018-03-22
CMinC

无缝滚动制作知识点 1、innerHTML 2、scrollTop（向上滚动的数值） 3、offsetHeight（元素自身的高度） 4、setInterval()（执行的方法） 5、clearInterval()（清除执行的方法） <script> var area = document.getElementById('moocBox'), con1 = document.getElementById('con1'), con2 = document.getElementById('con2'); con2.innerHTML = con1.innerHTML; function scrollUp(){ if(area.scrollTop >= con1.offsetHeight){ area.scrollTop = 0; }else{ area.scrollTop++; } } var time = 50; var myScroll = setInterval('scrollUp()',time); </script> <body> <div id="moocBox"> <ul id="con1"> <li>...</li> . . . <li>...</li> </ul> <ul id="con2"></ul> </div> </body>

查看全部

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

滚动方向direction（包括4个值：up、 down、 left和 right）语法：<marquee direction="滚动方向">...</marquee>

查看全部

0 采集收起来源：练习题
2018-03-22
CMinC

marquee标签实现信息滚动 <marquee>知识点 1.behavior滚动的方式 alternate:表示在两端之间来回滚动。 scroll:表示由一端滚动到另一端，会重复。 slide:表示由一端滚动到另一端，不会重复。 2.direction滚动的方向down、up、left、right 3.loop滚动的次数（当loop＝-1表示一直滚动下去，默认为-1） 4.scrollamount设定活动字幕的滚动速度 5.scrolldelay设定活动字幕滚动两次之间的延迟时间（以毫秒为单位） marquee标签成对出现要设置滚动的内容放在marquee标签里面

查看全部

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

首页上一页 23 24 25 26 27 28 29 下一页尾页

0/150

提交

取消

该课程已下架

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

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