首页 > web前端 > js教程 > DIV实现自动滚动功能及滚动条颜色修改

DIV实现自动滚动功能及滚动条颜色修改

高洛峰
发布: 2017-03-16 16:43:47
原创
3653 人浏览过

本文给大家介绍下DIV实现自动滚动功能及滚动条颜色修改,具体代码如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

<script type="text/javascript">

function startmarquee(lh, speed, delay) {

var t;

var oHeight = 300; /** p的高度 **/

var p = false;

var o = document.getElementById("show");

var preTop = 0;

o.scrollTop = 0;

function start() {

t = setInterval(scrolling, speed);

o.scrollTop += 1;

}

function scrolling() {

if (o.scrollTop % lh != 0

&& o.scrollTop % (o.scrollHeight - oHeight - 1) != 0) {

preTop = o.scrollTop;

o.scrollTop += 1;

if (preTop >= o.scrollHeight || preTop == o.scrollTop) {

o.scrollTop = 0;

}

} else {

clearInterval(t);

setTimeout(start, delay);

}

}

setTimeout(start, delay);

}

window.onload = function () {

/**startmarquee(一次滚动高度,速度,停留时间);**/

startmarquee(20, 40, 50);

</script>

 <p id="show" style="height: 600px; width: 100%; overflow-y: scroll;scrollbar-base-color:#ffffff;SCROLLBAR-HIGHLIGHT-COLOR:#ffffff;SCROLLBAR-ARROW-COLOR:#ffffff; overflow-x: none;"></p>

登录后复制

2.滚动条颜色

1

2

3

4

5

6

7

scrollbar-3d-light-color 设置或检索滚动条亮边框颜色 

crollbar-highlight-color 设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色

scrollbar-face-color 设置或检索滚动条3D表面(ThreedFace)的颜色 

scrollbar-arrow-color 设置或检索滚动条方向箭头的颜色

scrollbar-shadow-color 设置或检索滚动条3D界面的暗边(ThreedShadow)颜色 

scrollbar-dark-shadow-color 设置或检索滚动条暗边框(ThreedDarkShadow)颜色 

scrollbar-base-color 设置或检索滚动条基准颜色。

登录后复制

以上所述是php中文网给大家介绍的DIV 自动滚动功能及滚动条颜色修改的代码,希望对大家有所帮助。

相关文章:

设置p滚动条颜色的css代码

如何在样式表中区分不同的IE版本?如何使兼容IE8与IE10的滚动条颜色?

解决IE6下无法设置滚动条颜色

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板