javascript - 实时将文本添加到语音气泡中

Question

我有一个将形成 html 页面背景的图像，我想在它上面叠加语音气泡。我已经想出了如何用 css 制作气泡，并设置它们的位置。但我无法弄清楚我将如何填充气泡（div 元素）。文本消息将填充文件，我需要获取字符串并将它们显示在气泡中，并在消息进入时刷新气泡内容。有什么想法吗？

Answer 1

假设您的一个气泡包含一个如下所示的 DIV：

<div id="bubble1">This is the text</div>

您可以使用 Javascript 轻松更改文本内容。推荐使用像 jQuery 这样的 JS 库。这是一个更改文本的代码示例：

<script>

$(document).ready(function()
{
  $('#bubble1').text('This is the changed text'); // to change the text
  $('#bubble1').html('This has <b>some</b> formatting'); // to change the html
});

</script>

不要忘记将 jQuery 本身包含在如下行中：

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>

我不明白你从哪里得到你的字符串，如果你让我知道，我可以更新答案。

如果您不熟悉 jQuery，请看这里。

Answer 2

我认为这将回答您的问题： http: //nicolasgallagher.com/pure-css-speech-bubbles/ 请记住，这是 css3，因此较旧的浏览器可能会遇到问题。