鼠标过经图片时的遮罩效果

在制作文章图册形式时,首页的文章显示三张图片,鼠标经过时希望有原来的那种过渡效果,从CSS中找了下,提取出来:

/*侧边栏随机文章图片鼠标经过的特效*/
.diy-hot-ul .recent-post-img{position:relative}
.diy-hot-ul  .post-img-overlay {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: all 0.8s;
        background:-webkit-linear-gradient(180deg, rgba(0,0,0,0.01) 2%, rgba(0,0,0,0.95) 100%);
        background:linear-gradient(180deg, rgba(0,0,0,0.01) 2%, rgba(0,0,0,0.95) 100%)
}
.diy-hot-ul .recent-post-img:hover .post-img-overlay{opacity:.5}
标签:

分享文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

高度专注于企业与品牌形象高端设计领域,兼具国际视野与本土文化的设计理念.充分与高端时尚融合.我们的服务贯穿品牌建设始终,让品牌形象建设更加合理化,系统化.打造更加一致性的品牌口碑,让品牌市场领域更加专业.

壹壹创意设计网
顶部
按Enter键进行搜索或按ESC键关闭