当前位置:LaySNS首页 > 技术交流

给自己的网站添加下雪特效,不会影响鼠标点击

楼主:天下云游客 时间:2018-12-23 16:05:11 点击:1549 回复:0

样式图:

Snipaste_2018-12-23_15-49-40

Snipaste_2018-12-23_15-54-24

演示网站链接:http://www.23txw.com

网站是以白底为主,所以看得不太清楚,主要还是看你们网站的风格适不适合这特效。

教程开始:

找到模板文件中index_footer.html(放在这里,网站主页列表页文章页都会展示)

然后在之前插入以下代码(注:放在最后则需要,等网站资源全部加载完后才会开始加载下学特效)

如果要一打开就展示,就紧接着放在下面

	
	<style>
	/* 以下是CSS3样式,适合高版本浏览器 */
	.Snowflake{animation:linear spin infinite 20s;-webkit-animation:linear spin infinite 20s;-moz-animation:linear spin infinite 20s;pointer-events:none;}
	@keyframes spin{
		0% {transform:rotate(0deg);}
		100% {transform:rotate(359deg);}
	}
	@-webkit-keyframes spin{
		0% {-webkit-transform:rotate(0deg);}
		100% {-webkit-transform:rotate(359deg);}
	}
	@-moz-keyframes spin{
		0% {-moz-transform:rotate(0deg);}
		100% {-moz-transform:rotate(359deg);}
	}
	</style>
	
	<script src="https://www.23txw.com/template/b_default/js/snowflake.js"></script>	
		createSnow('', 100);
	</script>


0.108136s