當文本溢出div時顯示文本

Question

我在頁面上構建了一系列的圖塊，其中所有圖塊的大小相同（370px x 370px）。當文本溢出一個div時，文本的溢出部分被隱藏，並出現一個隱藏的滾動條。現在我希望滾動條保持隱藏狀態，但也有一些圖像或文本表示在特定的圖塊上隱藏了更多文本。

將出現「Read more」鏈接，指示將鼠標懸停在div上並閱讀更多內容。

下面是某事。我在想

$(document).ready(function(){ 
    if($('p').height() > ('div').height()) 
    { 
     $(this).html('Read more'); 
    } 
    }); 

我確定我上面的代碼是錯誤的，因此如果有人能給我一個提示，我將不勝感激。

感謝您的幫助提前。

Answer 1

您需要檢查每一個div，而不僅僅是一個全局集合。您可以使用以下過濾器：

$('div').filter(function(){ 
     return $(this).height() < $(this).find('p').height(); 
}).append('<span>Read more...</span>)