javascript - 重新创建媒体的图像缩放

标签 javascript jquery html css

我想重新创建 Medium 在您单击图像并希望查看其大图时使用的图像缩放效果。

这是它的一个例子.gif。 Here's an example .gif of it.

我已经尝试过多种方法,包括 jQuery CSS 转换等等 - 但我遇到了很多麻烦。

我怎样才能重新创建这样的效果?

最佳答案

缩放效果可以使用CSS transform 属性来实现。基本上你将图像平移到窗口中心,然后缩放图像。要缩小,只需删除转换值。

其实Medium的图片缩放有一个开源库叫zoom.js使用 jQuery。我还实现了一个类似的库 Zooming使用纯 JavaScript。

关于javascript - 重新创建媒体的图像缩放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37107119/

相关文章:

javascript - 过滤动态创建的表行(Jquery)

JQuery 检测由 JS 进行更改的更改输入

javascript - 使用 JavaScript 分页

javascript - Marionette 布局不存在

javascript - View 和 View 模型必须位于同一位置吗

javascript - 对象或方法链在 jQuery 中如何工作?

java - 通过ajax发送JSON并在JSP中通过请求获取参数

javascript - 如何使用 javascript/ajax 或任何其他验证格式验证用户名和密码以及从数据库中选择的角色

javascript - 如何在跨度内获取文本,并将其用于其他脚本

javascript - 在 IE 中打开时 Iframe 内的导航问题