让人“又爱又恨”的“五一小长假”过后,是个漫长的工作日,咱们牛耳不止是教员们,连“不学习不快乐”的同学们,也跟教务老师申请,可以双休么,亲?
这不,终于在假期过后迎来了第一个双休,而这个双休又是一个意义非凡的假日——“母亲节”。
每年五月第二个星期天都是母亲节。一般提前我们都会看到很多母亲节的营销活动,还有一些暖心的文案。爱要秀出来!看我们的朋友圈:
小时候,
妈妈的爱倾注在交织的针线中
长大了,
你的爱回报于每个用心敲下的代码里
名企高薪,IT精英
牛耳教育,让你用璀璨前程回报母爱
除了在朋友圈秀孝心,周末帮妈妈做做家务,下下厨也是极好的,如果妈妈不在身边,一句亲切的问候,一个神秘的礼物,也会让妈妈感动万分。
而作为一个特殊的群体程序员,他们的表述方式自然不按常理。
直接上【代码】!!
public class MothersDayFromCodeMonkeyView
public MothersDayFromCodeMonkeyView()
int age=0; //猿猿刚出生的时候
saying="crying"; //除了哭啼,还不知道如何去表达
while(true)
try
Thread.sleep(365*24*60*60*1000L);
catch (InterruptedException e)
break; //猿猿明白这意味着什么
age++; //岁月如梭
switch(age)
case 3:
saying = "妈妈,我爱您";
break;
case 10:
saying = "妈,听您的";
break;
case 16:
saying = "我妈真的很烦";
break;
case 18:
saying = "想要离开这个家";
break;
case 25:
saying = "妈,您当时是对的";
break;
case 30:
saying = "我想要去我妈家";
break;
case 50:
saying = "我不想要失去我妈";
break;
case unknownAge:
saying = "只要我妈还能在这,我愿意为了我妈放弃一切";
break;
default:
saying = youDefineIt();
break;
new Thread(){public void run()
while(isPeopleStillLive())
saying = "每个人都只有一个妈妈,要好好的孝敬我们的妈妈!";
} }.start();
public boolean isPeopleStillLive()
return true || false; //猿猿很明白,人类最清楚
public String youDefineIt()
//猿猿自己说......
StringBuffer result = new StringBuffer();
result.append("......");
result.append("......");
result.append("......");
result.append("......");
return result.toString();
private static final int unknownAge = 70; //业界把这个常量设成了70,猿猿希望是100
private String saying ="";
public static void main(String[] args)
new MothersDayFromCodeMonkeyView();
咱们程序员的父母(至少是绝大部分父母),别说这上面的编程语言,有些甚至都还不知道如何操作电脑。虽然也许母亲们会看不懂,但这种表述你我都能领会。
而下面这段代码出来的效果,想必妈妈们都会喜欢!动态心形像素图案!
完整【代码】:
定义dom,描绘出 8 行 9 列的心形像素图案,其中是指要填充颜色的像素点:
居中显示:
html,body{
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(silver, white);
}
设置心形的样式:
.heart {
display: grid;
grid-template-columns: repeat(9, 1fr);
grid-gap: 2px;
}
.heart > * {
width: 1em;
height: 1em;
border-radius: 0.1em;
font-size: 30px;
}
.heart dot{
background: red;
}
定义淡入淡出动画:
.heart dot{
filter: opacity(0);
animation: animation 5s ease-out infinite;
}
@keyframes animation{
0%{
filter: opacity(0);
transform: translateY(-10em);
}
25%{
filter: opacity(1);
transform: translateY(0);
}
75%{
filter: opacity(1);
transform: translateY(0);
}
100%{
filter: opacity(0);
transform: translateY(10em);
}
}
最后,让各像素点按不同时间入场,增强动画效果:
.heart dot:nth-of-type(2n) {
animation-delay: 0.2s;
}
.heart dot:nth-of-type(3n) {
animation-delay: 0.3s;
}
.heart dot:nth-of-type(4n) {
animation-delay: 0.4s;
}
.heart dot:nth-of-type(5n) {
animation-delay: 0.5s;
}
.heart dot:nth-of-type(6n) {
animation-delay: 0.6s;
}
.heart dot:nth-of-type(7n) {
animation-delay: 0.7s;
}
.heart dot:nth-of-type(8n) {
animation-delay: 0.8s;
}
.heart dot:nth-of-type(9n) {
animation-delay: 0.9s;
}
.heart dot:nth-of-type(10n) {
animation-delay: 1.0s;
}
.heart dot:nth-of-type(11n) {
animation-delay: 1.1s;
}
大功告成!
预览效果:https://codepen.io/comehope/pen/LmrZVX
怎么样?动手操作一下吧!让妈妈们看看这些“不明觉厉”的操作,嘿嘿!
咨询热线
400-0731-162