Javascript 在不移动文本的情况下对元素的缩放效果

我有一个里面有文字的演讲泡泡。我试图用

比例

效果

来隐藏它。但是当我这样做的时候，里面的文本也会移动，我的意思是出现换行符，而

缩放效果会发生。
如何将文本固定在内部并与语音气泡一起隐藏

这是我的密码：

Javascript:

var splash=$("#splash");
        splash.html("This is a short text. Hide this text.");
        splash.delay(2000).fadeIn(400).delay(1500).hide("scale",{percent: 0, direction: 'horizontal'},1000);

CSS:

HTML:


我找到了一个解决方案。

我只是在css中防止换行，并在文本中手动执行。
现在这些粗野的断线将不再出现

现在，javascript中的文本：

splash.html("This is a short text. <br> Hide this text.");

它在chrome中运行良好。感谢您的回复。不幸的是，这对我不起作用，但我找到了一些帮助我的方法。我会把它作为答案贴在这里。
<div id="splash" style="position:absolute; left:30px; top: 100px"></div>

splash.html("This is a short text. <br> Hide this text.");

white-space: nowrap;