【css】image 使用 transform:scale 放大后显示不全的问题

css 可以用 transform: scale(1.2) 实现图片放大 1.2 倍显示的功能,在此基础上可以修改 transform-origin 为用户点击的坐标值优化体验。问题在于 origin 位于图片下方时,图片放大后出现滚动条,而滚动条的高度会忽略放大显示的图片的上半部分,导致用户滚动到图片上方时会发现图片显示不全。


解决:可以设置图片的 margin-toptransform-originy 值,这样多余的部分会被顶下来,然后在渲染完成后设置 scrollTop = y,让图片滚动到原先的 origin

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-15 10:34:05       66 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-15 10:34:05       70 阅读
  3. 在Django里面运行非项目文件

    2024-07-15 10:34:05       57 阅读
  4. Python语言-面向对象

    2024-07-15 10:34:05       68 阅读

热门阅读

  1. [C++]this指针

    2024-07-15 10:34:05       23 阅读
  2. [C++]位图+布隆过滤器

    2024-07-15 10:34:05       24 阅读
  3. GESP CCF C++ 五级认证真题 2024年6月

    2024-07-15 10:34:05       27 阅读
  4. 使用Python实现携程并发处理

    2024-07-15 10:34:05       24 阅读
  5. 为什么请求接口会在后面接?_t=

    2024-07-15 10:34:05       19 阅读
  6. Why does Wi-Fi consume more battery power than cellular data?

    2024-07-15 10:34:05       23 阅读
  7. shell中关于数组的使用

    2024-07-15 10:34:05       23 阅读