javascript - 检测 CSS 中何时调整图像大小

标签 javascript css lightbox

我的博客文章位于 600 像素宽的容器中。当我的图像宽度超过 600px 时,我会通过 CSS 调整其大小 (.post img {max-width: 600px})

我希望用户能够单击这些调整大小的图像并在灯箱中查看完整尺寸的版本,但要做到这一点,我需要在 Javascript 中检测哪些图像已因此调整大小(因为我不希望到在帖子中内嵌显示全尺寸的灯箱图像)

最佳答案

您可以检查图像元素的 width 属性来获取图像的渲染宽度。如果是 600,则图像很可能会被缩小。但是,该图像最初的宽度可能正好是 600 像素。

如果浏览器支持新的 HTML 5 naturalWidth属性,您可以获取原始图像宽度(以像素为单位)并将其与 clientWidth 的值进行比较。

关于javascript - 检测 CSS 中何时调整图像大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3835827/

相关文章:

javascript - 质数确定 Javascript

css - & :hover with Sass not working

javascript - jQuery lightbox(featherlight) 如何运行 beforeOpen 和 afterOpen 事件

javascript - 为什么 Lightbox 会扩展我的网页?

jquery - 是否可以关闭 iframe 内的 beautifulphoto 模式?

javascript - 在 esc 按下时关闭模式(纯 JS)

java - jsp和jsi有什么区别?

javascript - TinyMCE:保存内容时我的 HTML 发生了变化。我怎样才能保留我的 HTML?

html - CSS Float 正在换行

javascript - 如何自动将字体添加到样式表中?