私のページには、CSS ルールwhite-space
、overflow
がtext-overflow
設定されている要素がいくつかあり、オーバーフローしたテキストはトリミングされ、省略記号が使用されます。
div {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
border: 1px solid black;
width: 150px;
margin: 5px;
padding: 5px;
font-family: sans-serif;
}
<div>
<span>Normal text</span>
</div>
<div>
<span>Long text that will be trimmed text</span>
</div>
JavaScript を使用して、どの要素のコンテンツがオーバーフローしているかを検出する方法はありますか?
ベストアンサー1
span 要素を引数として渡して、次の JS 関数を試してください。
function isEllipsisActive(e) {
return (e.offsetWidth < e.scrollWidth);
}