datacollect_scroll.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. window.onload = roll(50);
  2. window.onload = roll2(50);
  3. function roll(t) {
  4. var ul1 = document.getElementById("comment1");
  5. var ul2 = document.getElementById("comment2");
  6. var ulbox = document.getElementById("review_box");
  7. ul2.innerHTML = ul1.innerHTML;
  8. ulbox.scrollTop = 0; // 开始无滚动时设为0
  9. // var timer = setInterval(rollStart, t); // 设置定时器,参数t用在这为间隔时间(单位毫秒),参数t越小,滚动速度越快
  10. var timer = setInterval(rollStart, '40');
  11. // 鼠标移入div时暂停滚动
  12. ulbox.onmouseover = function () {
  13. clearInterval(timer);
  14. }
  15. // 鼠标移出div后继续滚动
  16. ulbox.onmouseout = function () {
  17. // timer = setInterval(rollStart, t);
  18. timer = setInterval(rollStart, '40');
  19. }
  20. }
  21. // 开始滚动函数
  22. function rollStart() {
  23. // 上面声明的DOM对象为局部对象需要再次声明
  24. var ul1 = document.getElementById("comment1");
  25. var ul2 = document.getElementById("comment2");
  26. var ulbox = document.getElementById("review_box");
  27. // console.log(ulbox.scrollTop);
  28. // 正常滚动不断给scrollTop的值+1,当滚动高度大于列表内容高度时恢复为0
  29. if (ulbox.scrollTop >= ul1.scrollHeight) {
  30. ulbox.scrollTop = 0;
  31. } else {
  32. ulbox.scrollTop++;
  33. }
  34. }
  35. function roll2(t) {
  36. var ul3 = document.getElementById("comment3");
  37. var ul4 = document.getElementById("comment4");
  38. var ulbox2 = document.getElementById("review_box2");
  39. ul4.innerHTML = ul3.innerHTML;
  40. ulbox2.scrollTop = 0; // 开始无滚动时设为0
  41. // var timer = setInterval(rollStart, t); // 设置定时器,参数t用在这为间隔时间(单位毫秒),参数t越小,滚动速度越快
  42. var timer2 = setInterval(rollStart2, '40');
  43. ulbox2.onmouseover = function () {
  44. clearInterval(timer2);
  45. }
  46. // 鼠标移出div后继续滚动
  47. ulbox2.onmouseout = function () {
  48. // timer = setInterval(rollStart, t);
  49. timer2 = setInterval(rollStart2, '40');
  50. }
  51. }
  52. function rollStart2() {
  53. // 上面声明的DOM对象为局部对象需要再次声明
  54. var ul3 = document.getElementById("comment3");
  55. var ul4 = document.getElementById("comment4");
  56. var ulbox2 = document.getElementById("review_box2");
  57. // console.log(ulbox2.scrollTop);
  58. // 正常滚动不断给scrollTop的值+1,当滚动高度大于列表内容高度时恢复为0
  59. if (ulbox2.scrollTop >= ul3.scrollHeight) {
  60. ulbox2.scrollTop = 0;
  61. } else {
  62. ulbox2.scrollTop++;
  63. }
  64. }
  65. // tableScroll('tableId', '100%', 30, 10);
  66. var MyMarhq;
  67. function tableScroll(tableid, hei, speed, len) {
  68. clearTimeout(MyMarhq);
  69. $('#' + tableid).parent().find('.tableid_').remove()
  70. $('#' + tableid).parent().prepend(
  71. '<table class="tableid_"><thead>' + $('#' + tableid + ' thead').html() + '</thead></table>'
  72. ).css({
  73. 'position': 'relative',
  74. 'overflow': 'hidden',
  75. 'height': hei + 'px'
  76. })
  77. $(".tableid_").find('th').each(function(i) {
  78. $(this).css('width', $('#' + tableid).find('th:eq(' + i + ')').innerWidth());
  79. });
  80. $(".tableid_").css({
  81. 'position': 'absolute',
  82. 'top': 0,
  83. 'left': 0,
  84. 'z-index': 9
  85. })
  86. $('#' + tableid).css({
  87. 'position': 'absolute',
  88. 'top': 0,
  89. 'left': 0,
  90. 'z-index': 1
  91. })
  92. if ($('#' + tableid).find('tbody tr').length > len) {
  93. if ($('#' + tableid).find('tbody tr').length > 30) {
  94. $('#' + tableid).find('tbody').html($('#' + tableid).find('tbody').html() + $('#' + tableid).find('tbody').html());
  95. } else {
  96. $('#' + tableid).find('tbody').html($('#' + tableid).find('tbody').html() + $('#' + tableid).find('tbody').html() + $('#' + tableid).find('tbody').html() + $('#' + tableid).find('tbody').html());
  97. }
  98. $(".tableid_").css('top', 0);
  99. $('#' + tableid).css('top', 0);
  100. var tblTop = 0;
  101. var outerHeight = $('#' + tableid).find('tbody').find("tr").outerHeight();
  102. function Marqueehq() {
  103. if (tblTop <= -outerHeight * $('#' + tableid).find('tbody').find("tr").length) {
  104. tblTop = 0;
  105. } else {
  106. tblTop -= 1;
  107. }
  108. $('#' + tableid).css('margin-top', tblTop + 'px');
  109. clearTimeout(MyMarhq);
  110. MyMarhq = setTimeout(function() {
  111. Marqueehq()
  112. }, speed);
  113. }
  114. MyMarhq = setTimeout(Marqueehq, speed);
  115. $('#' + tableid).find('tbody').hover(function() {
  116. clearTimeout(MyMarhq);
  117. }, function() {
  118. clearTimeout(MyMarhq);
  119. if ($('#' + tableid).find('tbody tr').length > len) {
  120. MyMarhq = setTimeout(Marqueehq, speed);
  121. }
  122. })
  123. }
  124. };