鼠标滑过图片图片放大显示

最新推荐文章于 2021-08-09 17:17:56 发布

黑盒变白盒才有意思

最新推荐文章于 2021-08-09 17:17:56 发布

阅读量1.8k

点赞数

分类专栏： web前端

web前端专栏收录该内容

15 篇文章 0 订阅

订阅专栏

效果如下：

滑过前：

滑过效果：

实现代码：

img:hover{
	-webkit-transition:0.5s ease;
    -moz-transition:0.5s ease;
    -webkit-transition-property:all;
    -moz-transition-property:all;
	-webkit-transform:scale(3);
	-moz-transform:scale(3);
	transform:scale(3);
	box-shadow:0 0 5px;
	}
 img{
    -webkit-transform-origin: 100% 0;
    -moz-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    transform-origin: 100% 0;z-index:2
}