Question

我正在使用此弹出式工具提示： http://www.dynamicdrive.com/dynamicindex16/showhint.htm

这样每当我鼠标悬停在[？]符号上时，都会显示一条消息。

在提供的脚本中：

<a href="#" class="hintanchor" onMouseover="showhint('Please choose a username. Should consist of alphanumeric characters only.', this, event, '150px')">[?]</a>

我打算在showhint函数中输入要在弹出窗口中显示的文本，如上所示。

我的问题是我要显示大量文本（即Word文档大小的半页），并且需要在段落之间安排中断。

当我将大量文本放在showhint函数的第一个参数中时，它不起作用。

如何通过适当的休息等方式获取工具提示以显示我的长消息？

谢谢！

Answer 1

您正在使用的“显示提示”脚本似乎接受内部的等HTML标记 - 这样您就可以将文字放在段落中

<a href="#" class="hintanchor" onMouseover="showhint('<p>Please choose a username.</p><p>Should consist of alphanumeric characters only.</p>', this, event, '150px')">[?]</a>

Answer 2

您可以在showhint文本中添加html标签，如下所示。它有效。

<a href="#" class="hintanchor" onmouseover="showhint('<b>Please choose a username.</b> &lt;p&gt;Should consist of alphanumeric characters only.&lt;/p&gt;', this, event, '150px')">[?]</a>

Answer 3

您是否尝试过放置\ n或\ n \ r或\ lt; br＆gt;或者＆lt; br /＆gt;在你想要休息的地方？这帮我过去了

Answer 4

通常不是，hover-help是什么。也许您最好使用showhint来显示预告片和链接以打开侧边栏，您可以在其中显示正常的html，并在用户输入时保持显示。

文档说支持 HTML ，所以您尝试了以下文字：

<html>line-1<br/>line-2</html>

Answer 5

你试过使用＆lt; br＆gt;换行？（没有空格）

像那样：

<a href="#" class="hintanchor" onMouseover="showhint('Please choose a username. <br> Should consist of alphanumeric characters only.', this, event, '150px')">[?]</a>

Answer 6

在你的popup css中使用word-wrap属性，如下所述

     <div id='row' style='word-wrap:break-word;'>

它将相应地包装文本

    #hintbox{ 
     /*CSS for pop up hint box */ 
    position:absolute; top: 0; 
    background-color:lightyellow; width: 150px;
    /*Default width of hint.*/ 
    padding: 3px; border:1px solid black;  
    font:normal 11px Verdana; 
    line-height:18px; 
    z-index:100; 
    border-right: 
    3px solid black; 
    border-bottom: 
    3px solid black; 
    visibility: hidden; 
    Word-wrap:break-word;

}

在鼠标悬停时显示大量文本

6 个答案: