Css 什么'；让网页上的一个元素保持静止而其余元素改变的最简单方法是什么？

不确定这是否是一个非常明显的问题，但我需要有一个嵌入式音乐播放器继续播放，同时用户查看网站的其余部分（单击链接以查看不同的页面等）。所以基本上把页面分成不同的部分，分别加载。几年前，我会用HTML框架来实现这一点，但这显然不再是一个热门的想法

---

希望这是有意义的，并感谢所有的响应。

如果您不想使用框架，您必须在用户请求时使用javascript加载每个部分。使用类似jQuery库的工具可以简化您自己的操作，您可以设置它，以便所有请求根据单击的内容更新某些包含div的内容。

让我们来解决使用“frame”这个词时的歧义。虽然

标记确实将在未来的HTML版本中停止使用，但

标记将继续得到支持，这是解决问题的理想方法。您的整个网站将由正文中的两个主要元素组成：

音乐播放器，以及

一个漂亮的大

，用来存放网站的可导航部分

这将允许音乐播放器连续播放，同时所有导航都在一个单独的框架中进行，有效地保持音乐播放器“静态”，并保持页面的其余部分动态。最重要的是，一旦浏览器开始支持HTML5，您将能够使用新的

无缝

属性来帮助将框架集成到页面的外观中。在此之前，您需要手动删除边框和滚动条，以便在所有浏览器中保持一致。您可以通过以下方式实现这一点：

<iframe src="navigable_page.html"
             frameborder="0" 
             scrolling="no" 
             marginwidth="0" 
             marginheight="0" 
             vspace="0" 
             hspace="0">
</iframe>

记住使用CSS设置高度。使用这种方法，您的布局也有很大的灵活性，如果不想重新设计，您不必重新设计任何东西。选项包括让框架占据整个网页，让音乐播放器放在所有其他内容的前面，可拖动，可调整大小等。网页设计师会想知道你是如何创建一个独立于其他变化内容的音乐播放器的。您还可以有一个占据整个页面的表，其中有两行。最上面一行可以有音乐播放器，最下面一行可以包含高度设置为100%的框架。使用框架，就像使用iframes一样，你不会失望。

今天的“热门”想法是让一切都变成AJAX。所有的导航和东西。从技术上讲，这被认为是一件坏事，但它被用于一些大型网站的使用，即Facebook（用于聊天，与您的情况非常类似）和Twitter（用于标题和更新）

你会给每个页面一个URL，比如mysite.com/#some folder/some page/someQueryKey/someValue

请注意，它是“#/”，因为在同一个页面中，所有页面都只是ajax调用

因为它是同一个页面，所以在进行AJAX传输时，可以保持所需的部分不变

有关如何实现此功能的技术细节，请搜索有关实现hash bang AJAX的内容（这就是所谓的Google can index的官方格式，URL通常在哈希符号“#！/”后加一个感叹号）

<>这不是最容易实现的，意味着整个站点的重新设计，所以，你可能想考虑其他选项：

弹出窗口：他们还没有100%死亡，而且“可能”适合你的情况

重新加载：可能只是在短时间内（使用JS）将您想要的数据存储在一些cookie中，然后在页面加载中检查数据，以便从您结束的地方继续，但用户将在这段时间内稍有停顿。因此，它可能不适用于音乐播放器

对于小部件本身的UI，如果您需要它位于页面中的某个位置，而不考虑滚动或任何内容（始终可见），您可以使用：

---

答对了。如果你想要动态内容而不加载页面，你必须对DOMIf进行javascript操作。如果你要采用这种方法，请使用AJAX将其他网页动态加载到页面上的一个DIV中。这就是我在我的网站上所做的。此页面可能有助于参考：使用框架是最简单的方法。为什么不是这样一种方法热门创意？StumbleUpon和Facebook都使用框架，在我看来，它们都是非常现代的网站。真的吗？我的印象是框架正在被淘汰……”注意。不要指望框架在未来的HTML版本中得到支持-那么我应该继续使用这种方法吗？我指的是

中的帧。很抱歉造成混淆。我从来没有使用过

标记。非常感谢您的回复。看起来iframes是最简单的选项，所以我将先尝试一下。再次感谢。：）非常感谢您的回复。将来肯定会更多地研究AJAX，因为它听起来像是现代web设计的基本元素。对于这个特定的项目，我想我会首先尝试iframes，因为它听起来更容易实现。再次感谢您的回复和多种解决方案。

.music-player
{
    position:fixed;
    bottom:5px;
    right:5px;
}