Skip to content

z1511676208/blog

This branch is 3 commits behind liuyunzhuge/blog:master.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

f77a31f · May 7, 2017
Aug 14, 2016
Jul 5, 2016
Nov 2, 2016
Nov 21, 2016
Jul 15, 2016
Jun 5, 2016
Aug 1, 2016
Dec 21, 2016
Oct 9, 2016
May 7, 2017
Oct 9, 2016
Dec 21, 2016
Aug 19, 2016
Jul 20, 2016
Nov 11, 2016
Jun 12, 2016
Jul 15, 2016
Aug 25, 2016
Nov 2, 2016
Aug 14, 2016
Jun 13, 2016
Aug 18, 2016
Sep 25, 2016
May 8, 2016
Dec 21, 2016

Repository files navigation

##animation 这个文件存放一些css3 animation相关的demo。

(1) 该文件夹内的demo运行方法:

  1. 前提:安装node.js git gulp

  2. 安装:npm install --save

  3. 运行:gulp -sw

(2) 该文件夹内容的相关介绍:

  1. animation-fill-mode的一些思考

##backbone_ajax 这个文件夹提供了一个简单的自定义ajax模块,覆盖了Backbone原有的ajax模块的实现,使得我们可以在用Backbone 完成异步请求时,完全跟传统的异步方式保持一致,代码很简单,相关的测试页面如下:

backbone_ajax的测试地址

但是该地址中大部分测试代码都无法获取期望的结果,因为是在gh-pages分支上发布的,github不允许静态页面内发送post请求,所以要想看到测试效果,最好是clone到本地预览了。

该文件夹内容的也在下面这篇文章中的第3部分有说明:

我对Backbone.js的一些认识

##backbone_router (1) 该文件夹内容的相关介绍:

使用backbone的history管理SPA应用的url

##css_name (1) 该文件夹内容的相关介绍:

  1. 面向属性的CSS命名

##layout (1) 该文件夹内容的相关介绍:

  1. 圣杯布局小结

##equal_height_layout (1) 该文件夹内容的相关介绍:

  1. 等高分栏布局小结

##form (1) 该文件夹内的demo运行方法:

  1. 前提:安装node.js git gulp

  2. 安装:npm install --save

  3. 运行:gulp -sw

(2) 该文件夹内容的相关介绍:

  1. 简洁易用的表单数据设置和收集管理组件

  2. 进一步丰富和简化表单管理的组件:form.js

  3. 利用jquery.validate以及bootstrap的tooltip开发气泡式的表单校验组件

  4. 简单封装分页功能pageView.js

  5. 列表组件抽象(1)-概述

  6. 列表组件抽象(2)-listViewBase说明

  7. 列表组件抽象(3)-分页和排序管理说明

  8. 列表组件抽象(4)-滚动列表及分页说明

  9. 列表组件抽象(5)-简洁易用的表格组件

##lottery

一个简单的根据不同的概率进行抽奖的DEMO。在该DEMO中,我预先定义好了五种类型的数据,用probability表示它们被抽到的概率。最后通过drawLottery 实现单次的抽奖。

##h5_demo

该文件夹存放我做的一些h5活动页面的demo,现在放的还比较少,将来会放地更多,对h5活动页面制作感兴趣的话欢迎关注这个文件夹的内容。

另外该文件夹里的东西,也包含一个比较全的gulp配置方案,可以做压缩,合并,以及资源的内联处理等,通过研究里面的gulpfile.js就能明白。

该文件夹内的demo运行方法:

  1. 前提:安装node.js git gulp

  2. 安装:npm install --save

  3. 运行:gulp -sw

##mouse_direction

该文件夹内容的相关介绍:

  1. 判断鼠标移入移出元素时的方向

##history

该文件夹内容的相关介绍:

  1. 理解浏览器的历史记录

##numerGrow 原本应该把这个文件夹命名为numberGrow,结果弄错了,懒得改了...

(1) 该文件夹内的demo运行方法:

  1. 前提:安装node.js git gulp

  2. 安装:npm install --save

  3. 运行:gulp -sw

(2) 该文件夹内容的相关介绍:

  1. 数字限时增长效果实现:numberGrow.js

##pushState

该文件夹内容的相关介绍:

  1. 理解浏览器历史记录(2)-hashchange、pushState

##quick_layout 这个文件夹里面的内容是对zxx.lib.css的一个整理,将这些代码利用less进行了整合,同时扩充了更多的属性。

里面提供有mixin,来快速对单个属性,进行等差序列的扩充。详情请研究里面的less代码,相对简单,所以没有写专门的博客介绍。针对zxx.lib.css提供的一些快速布局的类(如.inline_two,.inline_three这种),做了一个demo,演示它里面一些类的具体作用。你可以通过下面的方法来查看demo,并了解那些类的用法。

(1) 该文件夹内的demo运行方法:

  1. 前提:安装node.js git gulp

  2. 安装:npm install --save

  3. 运行:gulp -sw

##seajs

(1) 该文件夹内的demo运行方法:

  1. 前提:安装node.js git gulp

  2. 安装:npm install --save

  3. 运行:gulp -sw

(2) 该文件夹内容的相关介绍:

  1. 介绍一种基于gulp对seajs的模块做合并压缩的方式

  2. 快速了解微信小程序的使用,一个根据小程序的框架开发的todos app

##todos 这个文件夹提供多个版本的todos这个经典应用的实现。里面的子文件夹名分别代表它的实现方式。暂时只想用jquery和 backbone两个库来分别实现。目的是为了对比传统面向对象开发方法与MVVM开发方法的区别。

jquery版本的预览地址(我实现的)

backbone版本的预览地址(我实现的),跟官方版本不同的是,这个版本带交互效果,而且更接近真实的开发场景

jquery版本的其它实现(可通过chrome的开发者工具查看源码)

backbone版本的官方实现(可通过chrome的开发者工具查看源码)

原生js的实现(可通过chrome的开发者工具查看源码)

该文件夹内容的相关介绍:

我对Backbone.js的一些认识

About

博客相关的代码及demo

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 82.7%
  • CSS 10.5%
  • HTML 6.5%
  • PHP 0.3%