简体   繁体   English

html页面标题标签中的jQuery滚动字幕

[英]jQuery scrolling marquee in html page title tag

I want to place a scrolling marquee in my html title tag using jquery but don't know how and can't seem to find a good explanation online anywhere.我想使用 jquery 在我的 html 标题标签中放置一个滚动字幕,但不知道如何并且似乎无法在任何地方在线找到好的解释。 Can someone help me please?有人可以帮我吗?

That's not very hard to do if you just want it to scroll like the marquee tag:如果你只是想让它像marquee标签一样滚动,这并不难:

(function titleMarquee() {
    document.title = document.title.substring(1)+document.title.substring(0,1);
    setTimeout(titleMarquee, 200);
})();

That's pretty basic but should give you an idea on how to tweak it to your liking.这是非常基本的,但应该可以让您了解如何根据自己的喜好进行调整。

In Tatu Ulmanen's answer, there is a problem with space characters.在 Tatu Ulmanen 的回答中,空格字符存在问题。 As psarid stated as comment, after the first scroll, all of the spaces are removed.正如 psarid 作为评论所述,在第一次滚动后,所有空格都被删除。

This is because html parser trims texts.这是因为 html 解析器会修剪文本。 That means it removes the spaces at the end and at the beginning of the text.这意味着它会删除文本末尾和开头的空格。 When title is scrolling, the title object in html looks like that:当 title 滚动时,html 中的 title 对象如下所示:

<title>Scrolling Title With Spaces</title>
<title>crolling Title With SpacesS</title>
<title>rolling Title With SpacesSc</title>
<title>olling Title With SpacesScr</title>
...
<title>Title With SpacesScrolling</title>

As you can see above, we lost the space between words Scrolling and Spaces .正如您在上面看到的,我们丢失了单词ScrollingSpaces之间的Spaces To prevent that, we need to store original document.title somewhere in our javascript code and put a space or something else to the end of it.为了防止这种情况,我们需要将原始document.title存储在我们的 javascript 代码中的某处,并在其末尾放置一个空格或其他东西。 Then, we can scroll document.title by scrolling the text in the other variable.然后,我们可以通过滚动另一个变量中的文本来滚动document.title Here is the modified code of Tatu Ulmanen.这是 Tatu Ulmanen 的修改代码。

var documentTitle = document.title + " - ";

(function titleMarquee() {
    document.title = documentTitle = documentTitle.substring(1) + documentTitle.substring(0,1);
    setTimeout(titleMarquee, 200);
})();

Add the below script on your page head and then call the scrlsts() function on body onload在页面头部添加以下脚本,然后在主体加载时调用 scrlsts() 函数

<script type="text/javascript">
var scrl = $('title').text();
function scrlsts() {
     scrl = scrl.substring(1, scrl.length) + scrl.substring(0, 1);
     document.title = scrl;
     setTimeout("scrlsts()", 500);
     }
<script>

No jQuery:没有jQuery:

setInterval(function () {
  $("head title").html($("head title").html().substring(1) + $("head title").html().substring(0,1));
}, 300);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM