大家好,我是Ned,一个刚刚入门前端未满两年的大三小学生
未来路还长, 一起努力加油吧?~
各位掘友们,Ned在这里给各位兄弟姐妹们拜年啦~
新春这个文章说实话,经历了蛮多的,一开始其实我是想用做个老虎的,但是呢,失败了。废了好几个小时才搞出来两个,害,都怪我的能力连基本上手都算不上,没咋玩明白,下次一定给大家做点好康的~
于是我来实现我的第二个创意了,,对联的来源于github上一博主(仓库地址),我看他仓库里写了这么多创意满满的对联,我就拿来在过年之时,跟掘友们分享一下~
还没领到对联的快去抽取属于自己的新春对联吧~
抽取地址:抽取你的新春对联
我是将那位博主的对联做成了数组来存储:大致是这些字段
英文不好,拼音来凑,见谅,见谅
大致的排版有、、、,我是用cdn引入vue来做的,按钮跟标签都是直接拉的组件hhh,这么说来我好像只是付出了些许创意?
这个css写的真是太辣鸡了,就不放出来丢人了,我看百度图片里对联都差不多样子,嗯,大致也许它就长这样子!,对没错
点击网址,点击按钮:,即可获得程序员的专属对联,有个坏处是字体加载太慢了(可能跟我垃圾服务器的垃圾带宽有关系)
利用简单的一个随机数生成器生成处于的随机数
将数组值赋值到绑定对象即可,特别的简单~
后加的一个展开效果,就是一个改变高度的动画,为了不让字体因为高度变化被挤到别的地方所以要加,两个属性
为了能够每次点击抽取都能触发一次动画,所以用一个三目运算符绑定他的:,在抽取函数里调整好true or false 即可。
一共有种对联哦!加上一共22个,哈哈哈,掘友们,你们抽到心仪的了嘛~
来看看都有啥吧:
其实这个灵感主要来源于网上基于cnn的对对联的人工智能,但是py咱也写不出来,只好换个创意,搞一个咱程序员的对联~
到这里整个的介绍就完事了,再次提前给各位拜年了!
祝大家工作顺利,身体健康,万事如意!