html部分：
<div class="lj" style="width: 200px;height: 200px;position: absolute;z-index: 5;"><p>hellsidjfasjflsjflajs ljasdfjajfa</p></div>
css部分：
.filter{
-webkit-animation:filter 3s linear;
-o-animation:filter 3s linear;
animation:filter 3s linear;
}
@-webkit-keyframes filter {
0%{-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
}
100%{-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-o-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
}
}
@keyframes filter {
0%{-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
}
100%{-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-o-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
}
}
js部分：
$(document).ready(function(){ $('.lj').addClass('filter');});
模糊效果.gif
