javascript - 我希望能够水平滚动大图像,但同时显示可以可变的整个高度

标签 javascript css

我有一张 1900 像素乘 1000 像素的大图片;它的宽度可以通过 javascript 左右滚动查看,因为包含的 div 的 overflow-x 被隐藏了。图像高度将被缩放以在顶部横幅下方的可用空间内显示图像的完整高度,直至视口(viewport)底部——它不需要垂直滚动。

我的问题是如何最好地缩放图像高度,同时仍然保持图像比例并且图像足够大以便水平滚动仍然发生(除非屏幕分辨率超过图像比例)。我希望答案可以通过 CSS 完成,但 JavaScript 解决方案也是一种选择。

在此先感谢您的帮助,

斯兰

最佳答案

您是否正在寻找 overflow-y:scroll;overflow-x:hidden;,它只允许在 y 方向上进行原生滚动。然后,您可以通过 javascript 控制 x 滚动。

关于javascript - 我希望能够水平滚动大图像,但同时显示可以可变的整个高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10691553/

相关文章:

javascript - Node.js:逐行替换文本文件中模式的第二部分

javascript - 为什么在保存带有额外数据的 Backbone 模型时需要使用 JSON.stringify : {} parameters?

html - 在聊天中显示

css - 为什么我的@font-face 仅在 ie9 中损坏?

javascript - HighCharts 和 Javascript 将数据作为数组传递

java - Three.js:如何将场景转换为 MPG4 视频?

html - 文本对齐:居中,带有包装器、输入框和按钮本身不居中,但 Logo 居中很好

javascript - 我应该如何在我的页面中突出显示鼠标悬停的任何链接?

javascript - 是否可以在具有以下要求的图像的一 Angular 具有 alpha 透明度?

c# - 如何获取数据列表中选定的单选按钮文本?