怎么能把超出的文字隐藏,鼠标向右滑动之后显示全部?

如标题所述,一条文本框中,文字溢出时,设计师的需求是不用省略号(...)隐藏掉,要设置多余的字看不见但是用鼠标滑动后面的字时可以显示看到所有的字,这种操作怎么实现?谁有经验?
不是title属性的问题

clipboard.png
就像是你缩小浏览器之后,路径后面太长的都隐藏掉,鼠标滑动的时候可以看见剩余的部分内容。

阅读 7.4k
5 个回答

如果是移动端的话,可以用

overflow-x:scroll;

这样可以实现滑动时,显示隐藏内容,但是有滚动条,可以在外面包一层稍微小一点的盒子,正好好滚动条挡住,再给外面的盒子overflow:hidden,挡住滚动条

如果是pc端的话,实现很麻烦,要绑定事件,相对位移啥的。而且我也没见哪个pc端有这种需求吧

title?

<div title="aaaaaaaaaaaaaaa">aaaaa</div>

可以设置文本框overflow:hidden,鼠标滑过的时候重新设置,我不知道你说的全部显示是怎样的显示,如果是这样显示
图片描述

那就直接经过的时候改变overflow就行

overflow-x:auto?

//最简单的方法
oveflow-x:scroll;

但是会有滚动条

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题