zoukankan      html  css  js  c++  java
  • jquery 页眉单行信息滚动显示

    JSP:

    下面是控制滚动的样式。将滚动的内容查询出来。放在一个div 或者别的容器里面,我这里使用的是<dt>

    <style>
    #newCglist{300px;height:14px;line-height:14px;overflow:hidden}
    #newCglist li{height:14px;padding-left:10px;}
    </style>


    下面是滚动内容展示的容器

    <dt class="positionrel" id="newCglist" ><div class="new positionabs"></div></dt>


    下面是js,查询滚动展示内容

    var divhight ; //这是全部数据行的高度,每行行高*数据量
    var showtimes ; //显示全然部数据的时间,每行显示所需的时间*数据量

    function yejis(){
    setInterval('AutoScroll("#newCglist")',500);
    //最新成交案例展示
    $.post("zrAction!newCgList.action",null,function(data){
    divhight = data.length*14;
    showtimes = data.length*3000;
    $.each(data,function(i,datas){
    $ul = $("<ul></ul>");
    $tr = $("<li>"+datas[0]+" 签单成功!

    &nbsp;"+datas[1]+"元&nbsp;"+datas[2]+"&nbsp;"+datas[3]+"</li>");
    $ul.append($tr);
    $("#newCglist").append($ul);
    });
    });


    下面是控制滚动展示时间,以及样式

    /**
     * 首页顶部滚动效果,divhight 是全部数据的行高
     * showtimes   //循环滚动完这些数据所需的时间
     * @param {Object} obj
     * @memberOf {TypeName} 
     */
    function AutoScroll(obj){
    $(obj).find("ul:first").animate({
    marginTop:-divhight
    },showtimes,function(){
    $(this).css({marginTop:"0px"}).find("li:first").appendTo(this);
    });
    }

  • 相关阅读:
    hive表增量抽取到oracle数据库的通用程序(二)
    java进程的守护进程脚本
    hadoop2.7节点的动态增加与删除
    hive表增量抽取到oracle数据库的通用程序(一)
    arduino 驱动电调
    arduino IO口
    通过电机编码器AB相输出确定电机转向
    Wifi小车资料
    winform 按键控制
    vs2010 EF4.0 访问mysql
  • 原文地址:https://www.cnblogs.com/wzzkaifa/p/6971631.html
Copyright © 2011-2022 走看看