顯示工具提示只有當省略號活躍

我的下一個DIV：顯示工具提示只有當省略號活躍

<div class="div-class" style="width:158px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;" title=<%=myDesc%>

我怎麼能顯示只有省略號是活動的提示？

我覺得這個功能

function isEllipsisActive(e) { 
    return (e.offsetWidth < e.scrollWidth); 
}

但我不知道如何使用它知道我用JSP和Struts

來源

2013-10-02 junior

既然你設置當_would_溢出時將被削減的內容，你不會再有任何溢出，你可以檢查...你必須這樣做_before_應用溢出：隱藏。 – CBroe

[HTML - 如何在顯示省略號時激活工具提示]（http://stackoverflow.com/questions/5474871/html-how-can-i-show-tooltip-only-when-ellipsis-is - 激活） –

嘗試是這樣的：

Working DEMO
Working DEMO - with tooltip

$(function() { 
    $('div').each(function(i) { 

     if (isEllipsisActive(this)) 
      //Enable tooltip 
     else 
      //Disable tooltip 
    }); 
}); 

function isEllipsisActive(e) { 
    return (e.offsetWidth < e.scrollWidth); 
}

來源

2013-10-02 10:05:17

我有一個愚蠢的問題 $（功能...）我應該把它放在哪裏？ – junior

'$（document）.ready'我猜。 –

如何用TD代替DIV做同樣的事情？你能舉一個有關它的實例嗎？ – smartmouse

對於任何人使用qtip（正在流行）。首先，爲每個溢出元素添加一個類。

<span class="ellipsis-text">Some very long text that will overflow</span>

然後，使用jQuery選擇來選擇多個這樣的元素，並在你的元素，例如應用qTip插件（或想到的任何其他提示）：

$('.ellipsis-text').each(function() { 
    if (this.offsetWidth < this.scrollWidth) { 
     $(this).qtip({ 
      content: { 
       text: $(this).text() 
      }, 
      position: { 
       at: 'bottom center', 
       my: 'top center' 
      }, 
      style: { 
       classes: 'qtip-bootstrap', //Any style you want 
      } 
     }); 
    } 
});

來源

2016-10-31 17:43:05 Noxymon

顯示工具提示只有當省略號活躍

回答

相關問題