原生html標簽marquee被廢棄后js解決方案


  let Omarquee = document.getElementById(el)
  let timer = null

  scroll();
  Omarquee.addEventListener('mouseenter', function () {
    window.clearInterval(timer);
  })
  Omarquee.addEventListener('mouseleave', function () {
    timer = setInterval(function () {
      if (offset == scrollWeight) {
        offset = 0;
      }
      Omarquee.style.marginLeft = "-" + offset + "px";
      offset += 1;
    }, 50);
  })

  var offset = 0;
  var scrollWeight = Omarquee.offsetWidth;
  var length = Omarquee.children.length;

  function scroll() {
    for (var i = 0; i < length - 1; i++) {
      var node = Omarquee.children[i].cloneNode(true);
      Omarquee.appendChild(node);
    }
    timer = setInterval(function () {
      if (offset == scrollWeight) {
        offset = 0;
      }
      Omarquee.style.marginLeft = "-" + offset + "px";
      offset += 1;
    }, 50);
  }

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。