Html
    Css
    Js

    
                        
div {
	height:185px;
	display:inline-block;
	background:url('http://www.jq22.com/img/cs/500x500-1.png') center center no-repeat;
	background-size:contain;
	margin-left: 100px;
	margin-top: 100px;
}
img {
	height:100%;
	cursor:pointer;
	-webkit-animation:scaleout 3.3s infinite ease-in-out;
	animation:scaleout 3.3s infinite ease-in-out;
}
@-webkit-keyframes scaleout {
	0% {
	-webkit-transform:scale(1.0)
}
100% {
	-webkit-transform:scale(2.1);
	opacity:0;
}
}@keyframes scaleout {
	0% {
	transform:scale(1.0);
	-webkit-transform:scale(1.0);
	opacity:0;
}
10% {
	transform:scale(1.0);
	-webkit-transform:scale(1.0);
	opacity:1;
}
100% {
	transform:scale(2.1);
	-webkit-transform:scale(2.1);
	opacity:0;
}
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

css图片发光效果(原创)

0