我想要一个类似的悬停效果的图像有它在这个网站的项目页面:http://hellomonday.com/projects .我已经尝试搜索各种悬停效果等,但他们似乎都不正确。
有人知道如何做到这一点,或者可能有一个教程的链接等?
我不知道这个效果叫什么,所以我没能在谷歌上找到任何有用的东西:(
提前感谢:)
我想我能帮你一些忙。你需要一些东西来创造这种效果。首先得到var window_h = $(window).height()
和var window_w = $(window).width()
。
在调整大小事件中,不要忘记更新宽度和高度。然后用mouse.x
和mouse.y
求出真比值。每个图像应该有一个类,但它应该在div
或overflow:hidden
包装。然后用你计算的比率尝试找到你的translate3d。现在您应该达到所有图像的全局效果。然后在每个图像上尝试一个悬停事件。用不同的翻译和视角。