为了账号安全,请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
信息滚动效果制作_学习笔记_慕课网
为了账号安全,请及时绑定邮箱和手机立即绑定

信息滚动效果制作

vivian Web前端工程师
难度初级
时长39分
  • scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 (即网页被卷去的高)
    查看全部
    0 采集 收起 来源:练习题

    2016-07-03

  • <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()表示当鼠标以上区域的时候滚动停止,当鼠标移开的时候又继续滚动。
    查看全部
  • <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>
    查看全部
  • 1、innerHTML 2、scrollTop(向上滚动的数值) 3、offsetHeight(元素自身的高度) 4、setInterval()(执行的方法) 5、clearInterval()(清除执行的方法)
    查看全部
    0 采集 收起 来源:无缝滚动制作

    2016-07-01

  • marquee
    查看全部
  • 无缝滚动:当内容滚完之后,不想让它停止,也不让它空白。 说明:蓝色为显示区域,橘黄色为要滚动的内容 无缝滚动原理: 原始内容为1,克隆内容为2 当原始内容底部到达可视区的底部时,重新克隆出原始内容2,2在紧接在1的后面 当1的内容滚出可视区,2的内容到达可视区的顶部时,此刻就开始了无缝滚
    查看全部
    0 采集 收起 来源:无缝滚动原理

    2016-07-01

  • <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()表示当鼠标以上区域的时候滚动停止,当鼠标移开的时候又继续滚动。
    查看全部
  • 使用scrollLeft的必要条件是 第一:此标签的内容宽度超过了标签本身的宽度。 这个很容易理解,如果内容没有超过标签的宽度,不需要横向的滚动就可以看到所有横向的范围,那在使用scrollLeft的时候肯定是无效的了。 在这里很多新手经常会犯一个错误,内容的大小确实是超过了标签的显示范围,但是却因为浏览器的默认属性换行了,也就是没有在横向上超出,这时候同样是不能使用scrollLeft的。 第二:scrollLeft的值范围是在一定范围内的,不能无限增大。 当内容的最右端可以显示的时候,scrollLeft便不能再增加了。这个也容易理解。以浏览器右侧滚动条为例,这个滚动条肯定是能拖到底的,这个拖动有一定的范围,跟页面内容高度有关。 第三:scrollLeft(包括其他三个)常与定时器一起使用,实现位置移动效果,如滚动。 你应该遇到的是第一个条件不满足才产生的这个问题。所以建议你可以采用改变ul的margin-Left的值实现滚动效果
    查看全部
  • 1、innerHTML 2、scrollTop(向上滚动的数值) 3、offsetHeight(元素自身的高度) 4、setInterval()(执行的方法) 5、clearInterval()(清除执行的方法)
    查看全部
    0 采集 收起 来源:无缝滚动制作

    2016-06-28

  • <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()表示当鼠标以上区域的时候滚动停止,当鼠标移开的时候又继续滚动。
    查看全部
  • 信息无缝滚动知识点
    查看全部
    0 采集 收起 来源:无缝滚动制作

    2016-06-28

  • marquee标签知识点
    查看全部
  • 记住这个区别
    查看全部
  • mar-quee
    查看全部
  • <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()表示当鼠标以上区域的时候滚动停止,当鼠标移开的时候又继续滚动。
    查看全部

举报

0/150
提交
取消
课程须知
1.您至少具备HTML/CSS基础知识; 2.您至少具备JavaSript基础知识;
老师告诉你能学到什么?
1.学会<marquee>标签及属性,制作简单信息滚动。 2.掌握无缝滚动原理,运用JavaScript实现效果。 3.通过设定定时时间,实现间歇性无缝滚动。
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!