Marquee从左中开始

Marquee start in center to the left

本文关键字：开始 Marquee      更新时间：2023-09-26

我正在寻找一种从中心向左启动marquee（文本滑块）的方法。

因为如果我重新加载我的页面，字幕是空白的。

请注意，marquee在HTML5中已经过时，它的事件没有得到很好的支持。

也就是说，一种方法是使用text-indent，但它会使其滚动稍微偏移。要解决此问题，您可以在setInterval上缓慢降低其属性。看看这个小提琴，或者运行以下片段：

var textIndentPercent = 50;
var marqueeCenteringInterval = setInterval(function() {
    console.log(document.getElementById('my-marquee'));
    console.log(textIndentPercent);
    console.log(document.getElementById('my-marquee').style.textIndent);
    document.getElementById('my-marquee').style.textIndent = -textIndentPercent + '%';
    textIndentPercent -= 0.1;
    if (textIndentPercent < 0) {
        document.getElementById('my-marquee').style.textIndent = '0px';
        clearInterval(marqueeCenteringInterval);
    }
}, 100);
<marquee id="my-marquee" style="">This is basic example of marquee</marquee>

相关文章：