Css 使Div在圣诞节前后出现
我想问一个问题，我对html几乎一无所知，我想在页面上应用雪花效果。我从这里得到了代码并添加了它，但我想让它从11月1日到12月31日出现，然后自动消失，明年再次出现。有人能帮我想一想怎么做吗 codepen.io/codeconvey/pen/xRzQay 同样，这可能是一个问题的人谁做了这个，但有没有一个快速的方法，使它雪更多的雪花 谢谢Css 使Div在圣诞节前后出现,css,animation,effects,Css,Animation,Effects,我想问一个问题，我对html几乎一无所知，我想在页面上应用雪花效果。我从这里得到了代码并添加了它，但我想让它从11月1日到12月31日出现，然后自动消失，明年再次出现。有人能帮我想一想怎么做吗 codepen.io/codeconvey/pen/xRzQay 同样，这可能是一个问题的人谁做了这个，但有没有一个快速的方法，使它雪更多的雪花 谢谢 var d=新日期（） var d = new Date() if(d.getMonth() < 10){ //starts counti
var d=新日期（）
var d = new Date()
if(d.getMonth() < 10){ //starts counting from 0
var snows = document.getElementById("snows");
snows.remove();
}
如果（d.getMonth（）<10）{//从0开始计数
var snows=document.getElementById（“snows”）；
雪。移除（）；
}
<div class="snowflake">
❄
</div>
❄
进入你的html。正如我在评论中所说，你需要用JS获取当前日期，并检查它是否在11月1日到12月31日之间。简而言之，你只需要一个月。JS计算指数为零的月份（一月为0，十二月为11）。在您的情况下，您只需要检查月份是10还是11（不需要检查日期和年份）
/*https://pajasevi.github.io/CSSnowflakes/ */
如果（新日期（）.getMonth（）==10 | |新日期（）.getMonth（）==11）{
var children=document.getElementById（'snowflakes'）.children；
for（设i=0；i正文{
背景：红色；
}
/*可定制雪花造型*/
.雪花{
颜色：#fff；
字号：1em；
字体系列：Arial；
文本阴影：0 0 1px#000；
}
@-webkit关键帧雪花飘落{
0% {
前-10%
}
100% {
最高：100%
}
}
@-webkit关键帧雪花抖动{
0% {
-webkit转换：translateX（0px）；
转换：translateX（0px）
}
50% {
-webkit转换：translateX（80px）；
转换：translateX（80px）
}
100% {
-webkit转换：translateX（0px）；
转换：translateX（0px）
}
}
@关键帧雪花飘落{
0% {
前-10%
}
100% {
最高：100%
}
}
@关键帧雪花抖动{
0% {
转换：translateX（0px）
}
50% {
转换：translateX（80px）
}
100% {
转换：translateX（0px）
}
}
.雪花{
位置：固定；
前-10%；
z指数：9999；
-webkit用户选择：无；
-moz用户选择：无；
-ms用户选择：无；
用户选择：无；
游标：默认值；
-webkit动画名称：雪花飘落，雪花摇曳；
-webkit动画持续时间：10秒，3秒；
-webkit动画计时功能：线性，易入易出；
-webkit动画迭代计数：无限，无限；
-webkit动画播放状态：正在运行，正在运行；
动画名称：雪花飘落，雪花摇曳；
动画持续时间：10秒，3秒；
动画计时功能：线性，易入易出；
动画迭代次数：无限，无限；
动画播放状态：正在运行，正在运行
}
.雪花：第n个类型（0）{
左：1%；
-webkit动画延迟：0秒，0秒；
动画延迟：0秒，0秒
}
.雪花：第n种类型（1）{
左：10%；
-webkit动画延迟：1s，1s；
动画延迟：1s，1s
}
.雪花：第n种类型（2）{
左：20%；
-webkit动画延迟：6s、.5s；
动画延迟：6s、.5s
}
.雪花：第n种类型（3）{
左：30%；
-webkit动画延迟：4s，2s；
动画延迟：4s，2s
}
.雪花：第n种类型（4）{
左：40%；
-webkit动画延迟：2s，2s；
动画延迟：2秒，2秒
}
.雪花：第n种类型（5）{
左：50%；
-webkit动画延迟：8s，3s；
动画延迟：8s，3s
}
.雪花：第n种类型（6）{
左：60%；
-webkit动画延迟：6s，2s；
动画延迟：6秒，2秒
}
.雪花：第n种类型（7）{
左：70%；
-webkit动画延迟：2.5s，1s；
动画延迟：2.5s，1s
}
.雪花：第n种类型（8）{
左：80%；
-webkit动画延迟：1s，0s；
动画延迟：1s，0s
}
.雪花：第n种类型（9）{
左：90%；
-webkit动画延迟：3s，1.5s；
动画延迟：3s，1.5s
}
/*仅用于演示目的*/
.演示{
字体系列：“Raleway”，无衬线；
颜色：#fff；
显示：块；
保证金：0自动；
填充：15px0；
文本对齐：居中；
}
.演示a{
字体系列：“Raleway”，无衬线；
颜色：#000；
}
❅
❅
❆
❄
❅
❆
❄
❅
❆
❄