我有这样的东西。
<div class="someclass">
<label data-fieldid="191366" data-val="159" class="evLabel form-control">
Some Long Text
</label>
</div>
我这样做的是,如果文本太长,则通过编写 text-overflow:elipsis
、overflow:hidden
和 white 来 overflow hidden -空间:nowrap
。
我需要让它在悬停时显示工具提示式弹出窗口,其中包含整个文本(一些长文本),并且可能当它确实知道这个省略号何时实际上隐藏了某些内容时(所以,当它是必要的)。如何做这样的事情?
最佳答案
如果您需要对此进行修改,请发表评论。您还可以查看这个LINK
div {
line-height: 20px;
}
#data {
width: 100px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
#data:hover {
overflow: visible;
white-space: normal;
width: auto;
position: absolute;
background-color: #FFF;
}
#data:hover+div {
margin-top: 20px;
}
<div>1: ONE</div>
<div id="data">2: Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two Two </div>
<div>3: THREE</div>
<div>4: Four</div>
关于javascript - 以工具提示的形式显示文本溢出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43913463/