笔记

再一次，javascript设计模式与开发实践-策略模式

简述

定义一系列的算法，把它们一个个封装起来，并使它们可以相互替换。

在现实中要去一个地方，可以选择坐飞机、火车、骑自行车。
在程序设计中，也有类似的情况，例如压缩文件，可以选择zip算法，也可以选择gzip算法。

任意替换一种方式，目的不变就是策略模式。

使用场景

  • 算法
  • 表单验证
  • 运动动画
  • …

案例

更多

笔记

CSS3实战 笔记8-动画设计

transform

设置变形函数，可以是一个或多个变形函数列表。

  • matrix() 矩阵变换
  • translate() 移动元素对
  • scale() 缩放元素
  • rotate() 旋转元素
  • skew() 倾斜对象

transform-origin

CSS变形的原点默认是对象的中心点，可以通过此属性重新定义。

transition

动画转换过程，例如渐现、渐弱等。

  • transition-property 定义转换动画的名称，例如 background-color
  • transition-duration 定义转换动画的时长
  • transition-delay 定义动画的延迟时间
  • transition-timing-function 定义动画的效果，例如 ease、linear等

animation

定义动画

  • animation-name 定义动画名称
  • animation-duration 定义动画时长
  • animation-timing-function 定义播放方法，例如 ease、linear等
  • animation-delay 定义动画的延迟时间
  • animation-iteration-count 定义动画播放的次数
  • animation-direction 定义动画播放的方向

实战练习源码

笔记

CSS3实战 笔记7-渐变设计

gradient

  • type 定义渐变类型，linear(线性渐变) 或 radial(径向渐变)
  • point 定义渐变的起点和结束点，支持 数值、百分比、关键字等，例如 0,0 left,top。
  • [radius] 当定义径向渐变时，设置渐变的长度，参数为数值。
  • [stop] 定义渐变色和步长，包含三个类型值，开始的颜色使用 from(color value)，结束的颜色使用 to(color value)，颜色的步长使用 color-stop(value, color value)。

实战练习源码

效率

目前为止找到最好的移动端调试工具-debugGap

一些牢骚

  • 在桌面端调试目前已经很方便了，结构查看、CSS实时修改、网络请求、断点调试、性能检测、控制台…

  • 但在移动端，额.. 仿佛又回到了IE时代，最方便也只能到处 alert 来调试。

  • 当然也可以安装虚拟机、Android、IOS真机远程调试等办法，但我不喜欢，我是个怕麻烦的人。

  • 最后找到这一款应用 - DebugGap，还是基于 node-webkit 的，node.js爱好者表示\(^o^)/~。

更多

笔记

CSS3实战 笔记5-完善的和模型和UI设计

border-color

  • CSS3 增加了这个属性，使用它可以为边框设置更多的颜色。
  • 如果只为该属性设置一个颜色值时，表示宽边设置为纯色，如果设置N个值，且边框宽度为N像素，那么可以在该边框上使用N中颜色，每个颜色显示1像素的宽度，如果边框宽度为10个像素，但是只声明了5种颜色，那么最后一种颜色用于剩下的宽度。
  • 可设置四个边框的颜色属性
    • border-top-color
    • border-right-color
    • border-bottom-color
    • border-left-color

更多

作品►js

node.js 实现模拟登录，自动签到领流量。

开始本文之前，期待您了解页面与服务器的交互知识，会更容易理解。

需求

  • 某通有个活动，只要每天签到等各种操作就能累积积分，随着等级提升每月可以领到 20M - 300M 的流量等。

  • 作为码农的你当然不愿意以正常的姿势去完成这些事情，所以你想要程序代替你完成这些事情。（(^_\^_) 嘻嘻……）

更多