被忽略的两个 Background 新属性(CSS3)

之前在看一个文章的时候有提到过,background 的这两个属性,确实不常用到,以至于没有几个人知道这两个新属性。
和他们同时期出的 background-size 因为经常用到所以被大众所熟知。

对的,这次我要说的是background-originbackground-clip 两兄弟

阅读全文

鼠标移出时颠倒元素过度效果

今天有一个小伙伴在群里问,怎么让鼠标经过的移出效果和移入效果相反。

比如说
移入的时候先让元素增加宽度,接着增加高度,最后显示内部元素,
鼠标移出的时候,先收缩高度隐藏元素,最后还原宽度。

看了一些回复有些答非所问,或者推荐用 Js 的。
最开始想的是,animation 是不是有一个 direction 属性可以设置反向么,
就想看 transition 是不是也有,但是并没有。CSS transition - MDN
所以就想着用 :hover 来覆盖原先的 transition

阅读全文

使用 webpack 打包时去除注释和控制台日志

开一个坑,今天怎么尝试也都只能在打包的时候去除 console 但是注释还是不会被去除掉。

Jeecg-boot 开发挖坑日记09 AntD 表单校验

之前开发的时间比较赶,所以在某些还没弄明白的地方我直接使用了 v-model 来绑定数据,没并没有使用 v-decorator,所以表单验证需要自己手动去写,异常提示也是需要单独的去做,

现在空下来了,重新整理了一下业务代码,总的来说大部分的表单元素都有demo可以对照着看,复杂的部分也只是上传组件或者一些联动的部分。

阅读全文

如何让百度收录自己的Github Pages

为何百度不收录 Github Pages ???

起初还以为是应为自己写的文章很少关键词检索量不够所以没有被百度收录。
等了有几个月,Google 和 Bing 都收录了,百度还是没有动静,就查了下为啥不会被收录…

结果最后发现因为早些年
百度统计被劫持然后 DDos 攻击了 Github…
对 Github 用户造成了可用性的问题,然后被 Github Ban 掉了,对百度 UA 直接 403。

所以只能靠自己来做一些工作让百度蜘蛛可以收录自己的 Github Pages

具体方式有几种,我选择在国内搭建一个镜像(成本最低,Hexo 支持多个 Git 地址)
针对百度蜘蛛,解析到镜像服务器上以此来达到收录 Github Pages 的效果

阅读全文

Js对象 调整属性排序是否有意义

年会终于结束了,忙了一个月,终于可以开始填坑了。

昨天把之前写了一半的 滚动侦测导航 给写完了。

写的途中就有在思考 对象属性的排序问题,

最开始我是直接用数组的下标作为年份,输出的时候会出现一堆空白 item,

然后改成赋值给一个 timeline 对象,以年为属性名,月份为内部数组元素

但是循环输出内容的时候就发现会按照正序的方式去输出属性。
比如我整理好的数据为

阅读全文

CSS 实现条纹背景

preview

刚刚写年会红包雨的时候用到了 linear-gradient 来实现条纹背景,但是突然卡壳想不起来怎么写了。
就去百度一下,所以现在把它记下来,方便以后查阅。

阅读全文

年会开发日记03 - WebSocket长连接获取微信签到用户信息

接着 年会开发日记 01 的签到墙,
里边用到了 WebSocket 来实现用户微信扫码签到,然后后端推送签到用户信息到前端,
前端收到数据之后创建元素添加到 3D 墙中。

本来是想直接自己写的,但是有后来又加入了礼品活跃气氛,就要用到用户列表的展示和抽取过程中的随机效果,虽然哪些人获奖是后台返回给我的。
所以这些用户信息需要在多组件内共用,那我就懒得自己写了,就去找了 Vue 的组件库了。

阅读全文

年会开发日记02 - 红包雨

鸽了6个月了,终于想起来这篇还没有写完…

年会预备了一个红包雨的活动,虽然到最后也没有用上,但是笔记还是要写的。
整个流程是关注公众号,然后回复 抢红包 返回一个授权地址获取用户授权信息,然后跳转到活动h5页面,抢红包的同时会在大荧幕上实时展示排名数据。

阅读全文

Javascript 滚动侦测导航

一个以前的小项目要改,新增一个根据时间线显示不同月份绩效的需求。
没有设计稿,想了下怎么做出来好看。就有了以下这个想法

左侧显示时间线,滑动会显示不同的年份和月份,
右侧显示不同月份的统计数据。

阅读全文