如何使用css或jquery创建图像弯曲（见图） [英] How to create image curved using css or jquery (See picture)

问题描述

你知道如何采取这样的效果：图片
<当悬停在图片上时，img src =https://i.stack.imgur.com/RqRfX.pngalt =enter image description here>

Do you know how to take an effect like this: Image

我继续搜索css和jquery，但仍然无法达到我需要的。

I keep searching css and jquery but still not reach what i need.

请给我一个解决方案

非常感谢！

（对不起我的英语）

推荐答案

您可以使用CSS border-radius属性并将其应用于悬停，例如例如：

You can use CSS border-radius property and apply it on hover, e.g. something like:

#img:hover {
    border-top-right-radius:50% 10%;
    border-top-left-radius:50% 10%;
    border-bottom-right-radius:50% 10%;
    border-bottom-left-radius:50% 10%
}

演示： http://jsfiddle.net/r3KzP/1/

这篇关于如何使用css或jquery创建图像弯曲（见图）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！