zoukankan      html  css  js  c++  java
  • css&js实现顶部banner滚动提示效果

    以一个小例子来展示滚动提示的代码部分:

    try.html

    <div id="scrollobj" >
    <span class="scrollTxt">本活动将于2016年8月30日结束,如有抽奖机会,请尽快使用。&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp </span>
    </div>

    try.css

    #scrollobj{
    white-space:nowrap;
    overflow:hidden;
    100%;
    height: 30px;
    line-height: 30px;
    background-color: #0553a9;
    }
    .scrollTxt{
    100%;
    font-size: 16px;
    color: #fff880;
    }

    try.js

    function scroll(obj) {
    var tmp = (obj.scrollLeft)++;
    //当滚动条到达右边顶端时
    if (obj.scrollLeft==tmp) { obj.innerHTML += obj.innerHTML;}
    //当滚动条滚动了初始内容的宽度时滚动条回到最左端
    if (obj.scrollLeft>=obj.firstChild.offsetWidth) { obj.scrollLeft=0; }

    }
    $interval(function(){
    scroll(document.getElementById('scrollobj'));
    },30);

  • 相关阅读:
    莫队总结
    三、模型层(二)
    二、模型层(一)
    五、web杂项
    一. Django入门
    二、js
    一、html和css
    二十一、正则表达式
    END:小练习、涨知识
    二十、协程
  • 原文地址:https://www.cnblogs.com/lulin1/p/5795962.html
Copyright © 2011-2022 走看看