【问题标题】:CSS/HTML scrolling text without scrollbars没有滚动条的 CSS/HTML 滚动文本
【发布时间】:2011-09-22 21:48:09
【问题描述】:

全部!

我需要在图片上用like来制作效果。我可以制作文本阴影(文本顶部和底部的透明图像),但我不知道如何制作没有滚动条和剪辑的可滚动文本(溢出:隐藏)。有什么想法吗?

我只有一个想法 - 在滚动条上添加图像以向用户隐藏它

【问题讨论】:

  • 如果没有滚动条,用户应该如何查看首屏下方的文本?
  • 你为什么要这样做?
  • 马特,用户应该通过鼠标滚动来滚动文本。
  • @VeroLom 他们没有滚轮是什么?
  • 滚动条的用途超出了它的主要功能——它提供了一个视觉提示,表明有文本可以滚动。如果你没有,不要惊讶,如果有很多人们完全错过了首屏下方的文字。

标签: html css scroll


【解决方案1】:

试试这个:

<div id="container" style="width: 183px; height: 183px; overflow:
hidden; border: solid black 1px">
<div id="floating-div" style="width: 200px; height:200px; overflow:
auto">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. 
</div>
</div>

【讨论】:

  • 非常感谢!这是我需要的)
  • 这只有在你知道滚动条的宽度为 17px 或更小时才有效。根据操作系统/应用程序设置,滚动条可能会更宽。
  • @checkenginelight:在 Chrome/Safari 中尝试您的演示:突出显示/选择一行并将鼠标向右拖动,您将看到滚动条。或者使用 textarea 代替内部元素,然后用一些文本填充它。然后使用键盘键Page UpPage Down
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2013-07-10
  • 1970-01-01
  • 2018-11-17
  • 1970-01-01
  • 2015-12-15
  • 1970-01-01
  • 2013-02-25
相关资源
最近更新 更多