【问题标题】:Smooth Scrolling & Dynamically Changing the Page Title平滑滚动和动态更改页面标题
【发布时间】:2011-11-25 19:31:41
【问题描述】:

我目前有一个网站可以更改页面标题以反映当前正在播放的任何歌曲。我想做的是让页面的标题不断滚动,这样用户就可以看到正在播放的歌曲的全名,即使他们打开了很多标签。

我尝试了几个不同的滚动插件,但我发现效果最好的是这里的插件: http://www.seangw.com/wordpress/index.php/2009/01/basic-ajax-tutorial-smooth-scrolling-text-marquee-with-a-jquery-plugin/

我可以让插件在常规正文元素上正常工作,但是当我将它放在页面标题上时它不起作用。我尝试将标签包装在标签中,但它不起作用。此外,我的页面标题会动态变化,因此滚动文本也需要更改。

这是我要更改标题的 javascript 函数:

function playNext(newState)
{
    //alert("new state: " + newState);
    //unstarted (-1), ended (0), playing (1), paused (2), buffering (3), video cued (5)
    if(newState == 0) //song is done
    {
        //**************minimize myself*******************
        var i = ' . $this->i .';
        var dataString = getDataString(i);
        minimizeSong(dataString, i);
        //**************maximize next song****************
        dataString = getDataString(i+1); //i + 1 is next song
        maximizeSong(dataString, i+1);
        //I will automatically start playing on load
    }
    else if(newState == 1) // if its playing, change the title
    {
        $("title").text("' . $this->title . ' by ' . $this->artist . '    - T3k.no");
    }
    else if(newState == 2) //song is paused, go back to original title
    {
        $("title").text("Paused - T3k.no");
    }
    else if(newState == 3) //song is buffering, change title
    {
        $("title").text("Loading '.$this->artist .' - T3k.no");
    }
}

有人可以帮忙吗?我该如何实现这一目标?

这不起作用:

<html><head>
<marquee behavior="scroll" direction="left" scrollamount="2"
      height="75" width="150">
    <title>WANT THIS TO SCROLL</title>
</marquee>
</head></html>

但是这样的事情很好用:

<body>
    <marquee behavior="scroll" direction="left" scrollamount="2"
          height="75" width="150">
          <p>This is a test of a Smooth Marquee using jquery.</p>
     </marquee>
</body>

【问题讨论】:

  • 您发布的代码几乎与您的选框问题无关。几乎不可能回答你的问题。请贴一些与实际实现选框效果相关的代码。
  • 编辑了我的代码,其中包含哪些有效和哪些无效的示例。谢谢

标签: jquery ajax scroll title marquee


【解决方案1】:

这是你的 jQuery 就绪函数:

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

marquee 插件无法按预期工作,因为其中一个 head 标记无法呈现。它的主要用途是设置您的页面及其资源。 ma​​rquee 标签是为呈现的页面元素制作的。 headtitle 标签并没有像以前那样处于“正常流程”中。

【讨论】:

  • +1 谢谢,这帮了很多忙。它随着我动态变化的标题而变化。我仍然遇到的一些问题是: 1. 标题第一次滚动完成后,所有空格都从后续选取框中删除。 2.滚动不如我用的插件流畅。
  • 您可以通过降低超时功能的延迟使其更平滑一些。但是,请注意,浏览器会限制分配给非活动选项卡的资源。因此,用户最终可能会在某些时候将其视为波涛汹涌的。从代码中可以看出,这实际上更像是一种浏览器黑客攻击。您应该能够通过一些更高级的字符串操作来解决间距问题。也就是说,这不是最佳实践,建议不要将其投入生产。
猜你喜欢
  • 2020-04-05
  • 2012-05-18
  • 1970-01-01
  • 2023-03-21
  • 1970-01-01
  • 1970-01-01
  • 2020-09-05
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多