jQuery插件FontScroll创建自定义文字滚动效果
  • 分享到微信朋友圈
    X
立即下载 查看演示

本文介绍jQuery FontScroll - 文字行向上滚动插件

使用方法：

使用前您一定要引入jQurey及本脚本

<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/FontScroll.js" type="text/javascript"></script>

1、为您要设置滚动的对象设置容器，并命名id，如id="FontScroll"

2、将您要滚动的对象置入ul中，并添加li标签……

<div id="FontScroll">
    <ul>
        <li><a href="#">第1条</a></li>
        <li><a href="#">第2条</a></li>
        <li><a href="#">第3条</a></li>
        <li><a href="#">第4条</a></li>
        <li><a href="#">第5条</a></li>
        <li><a href="#">第6条</a></li>
        <li><a href="#">第7条</a></li>
        <li><a href="#">第8条</a></li>
        <li><a href="#">第9条</a></li>
    </ul>
</div>

3、在页面中添加jQuery语句，调用此插件，并对相关参数进行设置,如：

<script>
    $('#FontScroll').FontScroll({ time: 2000, num: 1 }); 
</script>

默认属性：

  • time: 3000, //时间

  • s: 'fontColor', //样式

  • num: 1 //赋值样式的位置，从零开始计数，默认第二行