2017-04-11 108 views
0

我在我的web應用程序中有一個頁面,該頁面有多個控件,在徘徊時顯示jQueryUI工具提示。這對包含帶空格的標準文本的工具提示非常有用。jQueryUI工具提示 - 無空格的文本與工具提示容器重疊

但是,如果工具提示文本不包含空格,例如文件路徑或數據庫字段名稱,則文本會與工具提示容器重疊。

我如何獲得強制文本換行到標準工具提示那樣的另一行?

在此先感謝。

JSFiddle Demo

代碼

$('.jQueryTooltip').tooltip(); 

<p> 
    <span title="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.">Standard tooltip with spaces</span> 
</p> 

<p> 
    <span title="Loremipsumdolorsitamet,consecteturadipiscingelit,seddoeiusmodtemporincididuntutlaboreetdoloremagnaaliqua.Utenimadminimveniam,quisnostrudexercitationullamcolaborisnisiutaliquipexeacommodoconsequat">Standard tooltip without spaces</span> 
</p> 

<p> 
    <span class="jQueryTooltip" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.">jQuery tooltip with spaces</span> 
</p> 

<p> 
    <span class="jQueryTooltip" title="Loremipsumdolorsitamet,consecteturadipiscingelit,seddoeiusmodtemporincididuntutlaboreetdoloremagnaaliqua.Utenimadminimveniam,quisnostrudexercitationullamcolaborisnisiutaliquipexeacommodoconsequat">jQuery tooltip with spaces</span> 
</p> 
+0

申請'跨度{ 自動換行:打破字; }' –

回答

1

您可以使用此風格:

.ui-tooltip { 
    word-wrap: break-word; 
}