zoukankan      html  css  js  c++  java
  • js无缝滚动

    页面主要代码如下:

    <div id="scrollarea" class="scrollarea" style="height:100%;overflow: hidden">
      <div id="clonepart" style="margin-top:0">
       </div>
       <div id="clonepartHide">
       </div>
    </div>

    数据调用方法代码如下:

    $.ajax({
      url: "${ctx}/pwlp/decision/environmentSubject/getlawItem.ht",
      type: 'POST', //GET
      async: true,    //或false,是否异步
      data:{year:year,districtCode:districtCode,monthVal:monthVal,domain:"sthjhzybh"},
      dataType: 'json',    //返回的数据格式:json/xml/html/script/jsonp/text
      success: function (data) {
        $("#clonepart").empty();
        var str = "";
        var classArr = new Array("juxh-one","juxh-two","juxh-three","juxh-four","juxh-five","juxh-six","juxh-seven");
        for(var i = 0; i < data.thematicAnalysisList.length; i++){
          if(i < 7){
            str += "<div class='judgeRule-list districtRankDiv-list'>"+
                  "<div class='judgeRule-list-left fl'>"+
                    "<span class='judgeRule-list-xh "+classArr[i]+"'>"+(i+1)+"</span>"+
                    "<span>"+data.thematicAnalysisList[i].lawItem+"</span>"+
                  "</div>"+
                "</div>"
          }
        }
        if(str == ""){
          $("#clonepart").append("<div style='100%; text-align:center'>暂无数据</div>");
        }else{
          $("#clonepart").append(str);
        }
        var flag = false;
        if(data.thematicAnalysisList.length > 6){
          flag = true;
        }
        roll('clonepart','clonepartHide','scrollarea',flag);
      }
    })

    无缝滚动代码如下:

    //轮播滚动
    function roll(newDataUl,hideNewDataUl,newDataDiv,flag) {
      var ul1 = document.getElementById(newDataUl);
      var ul2 = document.getElementById(hideNewDataUl);
      var box = document.getElementById(newDataDiv);
      if(flag){
        ul2.innerHTML = ul1.innerHTML;
      }
      box.scrollTop = 0;
      var timer = setInterval(rollStart, 30);
      box.onmouseover = function () {
        clearInterval(timer);
      }
      box.onmouseout = function () {
        timer = setInterval(rollStart, 30);
      }
      function rollStart() {
        var ul1 = document.getElementById(newDataUl);
        var box = document.getElementById(newDataDiv);
        if (box.scrollTop >= ul1.scrollHeight) {
          box.scrollTop = 0;
        } else {
          box.scrollTop++;
        }
      }
    }
  • 相关阅读:
    Different AG groups have the exactly same group_id value if the group names are same and the ‘CLUSTER_TYPE = EXTERNAL/NONE’
    An example of polybase for Oracle
    use azure data studio to create external table for oracle
    Missing MSI and MSP files
    You may fail to backup log or restore log after TDE certification/key rotation.
    Password is required when adding a database to AG group if the database has a master key
    Use KTPASS instead of adden to configure mssql.keytab
    ardunio+舵机
    android webview 全屏100%显示图片
    glide 长方形图片显示圆角问题
  • 原文地址:https://www.cnblogs.com/henuyuxiang/p/11842011.html
Copyright © 2011-2022 走看看