├── .gitignore ├── jquery-demos ├── css │ └── css_r.css ├── images │ ├── b1.jpg │ ├── b2.jpg │ ├── b3.jpg │ ├── s1.jpeg │ ├── s1.jpg │ ├── s2.jpg │ ├── s3.jpg │ ├── s4.jpg │ ├── s5.jpg │ ├── s6.jpg │ ├── f059.png │ ├── img1.jpg │ ├── img10.jpg │ ├── img11.jpg │ ├── img12.jpg │ ├── img13.jpg │ ├── img14.jpg │ ├── img15.jpg │ ├── img16.jpg │ ├── img17.jpg │ ├── img18.jpg │ ├── img19.jpg │ ├── img2.jpg │ ├── img20.jpg │ ├── img3.jpg │ ├── img4.jpg │ ├── img5.jpg │ ├── img5.png │ ├── img6.jpg │ ├── img7.jpg │ ├── img8.jpg │ ├── img9.jpg │ ├── jiantou3.png │ ├── jiantou4.png │ ├── jiantou5.png │ ├── jiantou6.png │ ├── clipboard3.png │ ├── fangdajing.jpg │ ├── jiantoulist.png │ ├── shoufengqin1.jpg │ ├── shoufengqin2.jpg │ ├── shoufengqin3.jpg │ └── shoufengqin4.jpg ├── accordion.html ├── drop.html ├── magnifier.html ├── tiggle.html ├── light-ad.html ├── riddle1.html ├── riddle2.html ├── ancient-poetry2.html ├── idiom.html ├── slider-3.html ├── js │ ├── subject1.js │ ├── subject.js │ └── mich1.1.js ├── taobao-ad.html ├── ancient-poetry1.html └── ancient-poetry.html ├── .npmrc ├── html5-demos ├── picker │ ├── picker.wav │ └── picker.html ├── downloadImg │ ├── 111.jpg │ ├── 222.jpg │ └── downloadImg.html ├── bubble │ ├── bubble.html │ ├── main.js │ ├── main1.js │ └── bubble1.html └── snow │ └── snowdemo.html ├── css3-demos ├── marquee │ ├── images │ │ ├── 1.jpg │ │ ├── 2.jpg │ │ ├── 3.jpg │ │ └── 4.jpg │ └── marquee.html ├── smoke-text │ └── smoke-text.html ├── accordion │ └── accordion.html └── nav-select │ └── nav-select.html ├── vue-demos ├── slider-img │ ├── images │ │ ├── timg1.jpg │ │ ├── timg2.jpg │ │ ├── timg3.jpg │ │ └── timg4.jpg │ ├── slider-img-vue.html │ └── slider-img.html ├── shopping-card │ ├── shopping_cart.png │ └── shopping-card.html ├── blur-text │ ├── blur-text.html │ └── blur-text-vue.html ├── nav │ ├── nav-vue.html │ └── nav.html ├── testdo.html ├── tab │ └── tab.html ├── todoList │ └── todoList.html └── sudoku │ └── sudoku.html ├── reset.css ├── package.json ├── gulpfile.js ├── LICENSE └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | .idea 2 | node_modules 3 | *.log -------------------------------------------------------------------------------- /jquery-demos/css/css_r.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/css/css_r.css -------------------------------------------------------------------------------- /jquery-demos/images/b1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/b1.jpg -------------------------------------------------------------------------------- /jquery-demos/images/b2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/b2.jpg -------------------------------------------------------------------------------- /jquery-demos/images/b3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/b3.jpg -------------------------------------------------------------------------------- /jquery-demos/images/s1.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/s1.jpeg -------------------------------------------------------------------------------- /jquery-demos/images/s1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/s1.jpg -------------------------------------------------------------------------------- /jquery-demos/images/s2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/s2.jpg -------------------------------------------------------------------------------- /jquery-demos/images/s3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/s3.jpg -------------------------------------------------------------------------------- /jquery-demos/images/s4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/s4.jpg -------------------------------------------------------------------------------- /jquery-demos/images/s5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/s5.jpg -------------------------------------------------------------------------------- /jquery-demos/images/s6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/s6.jpg -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | registry = http://registry.npm.taobao.org 2 | sass_binary_site=https://npm.taobao.org/mirrors/node-sass/ -------------------------------------------------------------------------------- /html5-demos/picker/picker.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/html5-demos/picker/picker.wav -------------------------------------------------------------------------------- /jquery-demos/images/f059.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/f059.png -------------------------------------------------------------------------------- /jquery-demos/images/img1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img1.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img10.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img11.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img12.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img12.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img13.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img13.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img14.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img14.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img15.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img15.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img16.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img16.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img17.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img17.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img18.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img18.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img19.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img19.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img2.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img20.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img20.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img3.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img4.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img5.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img5.png -------------------------------------------------------------------------------- /jquery-demos/images/img6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img6.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img7.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img8.jpg -------------------------------------------------------------------------------- /jquery-demos/images/img9.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/img9.jpg -------------------------------------------------------------------------------- /css3-demos/marquee/images/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/css3-demos/marquee/images/1.jpg -------------------------------------------------------------------------------- /css3-demos/marquee/images/2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/css3-demos/marquee/images/2.jpg -------------------------------------------------------------------------------- /css3-demos/marquee/images/3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/css3-demos/marquee/images/3.jpg -------------------------------------------------------------------------------- /css3-demos/marquee/images/4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/css3-demos/marquee/images/4.jpg -------------------------------------------------------------------------------- /html5-demos/downloadImg/111.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/html5-demos/downloadImg/111.jpg -------------------------------------------------------------------------------- /html5-demos/downloadImg/222.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/html5-demos/downloadImg/222.jpg -------------------------------------------------------------------------------- /jquery-demos/images/jiantou3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/jiantou3.png -------------------------------------------------------------------------------- /jquery-demos/images/jiantou4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/jiantou4.png -------------------------------------------------------------------------------- /jquery-demos/images/jiantou5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/jiantou5.png -------------------------------------------------------------------------------- /jquery-demos/images/jiantou6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/jiantou6.png -------------------------------------------------------------------------------- /jquery-demos/images/clipboard3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/clipboard3.png -------------------------------------------------------------------------------- /jquery-demos/images/fangdajing.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/fangdajing.jpg -------------------------------------------------------------------------------- /jquery-demos/images/jiantoulist.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/jiantoulist.png -------------------------------------------------------------------------------- /jquery-demos/images/shoufengqin1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/shoufengqin1.jpg -------------------------------------------------------------------------------- /jquery-demos/images/shoufengqin2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/shoufengqin2.jpg -------------------------------------------------------------------------------- /jquery-demos/images/shoufengqin3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/shoufengqin3.jpg -------------------------------------------------------------------------------- /jquery-demos/images/shoufengqin4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/jquery-demos/images/shoufengqin4.jpg -------------------------------------------------------------------------------- /vue-demos/slider-img/images/timg1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/vue-demos/slider-img/images/timg1.jpg -------------------------------------------------------------------------------- /vue-demos/slider-img/images/timg2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/vue-demos/slider-img/images/timg2.jpg -------------------------------------------------------------------------------- /vue-demos/slider-img/images/timg3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/vue-demos/slider-img/images/timg3.jpg -------------------------------------------------------------------------------- /vue-demos/slider-img/images/timg4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/vue-demos/slider-img/images/timg4.jpg -------------------------------------------------------------------------------- /vue-demos/shopping-card/shopping_cart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sijinglei/demos/master/vue-demos/shopping-card/shopping_cart.png -------------------------------------------------------------------------------- /reset.css: -------------------------------------------------------------------------------- 1 | body, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, ol, li, th, td, p, pre, form, input, button, textarea, hr { 2 | margin: 0; 3 | padding: 0 4 | } 5 | 6 | em, i { 7 | font-style: normal; 8 | } 9 | 10 | ul, li { 11 | list-style: none; 12 | } 13 | .clear:after{ 14 | display: block; 15 | content: ""; 16 | clear: both; 17 | } 18 | .fllil li{ 19 | float: left; 20 | } -------------------------------------------------------------------------------- /html5-demos/bubble/bubble.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 粒子模拟文字效果 8 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "chen-demos", 3 | "version": "1.0.0", 4 | "description": "个人制作的demo", 5 | "dependencies": {}, 6 | "devDependencies": { 7 | "babel-preset-es2015": "^6.24.1", 8 | "browser-sync": "^2.18.12", 9 | "gulp": "^3.9.1", 10 | "gulp-babel": "^6.1.2", 11 | "gulp-clean-css": "^3.7.0", 12 | "gulp-file-include": "^1.1.0", 13 | "gulp-modify-css-urls": "^0.2.2", 14 | "gulp-sass": "^3.1.0", 15 | "gulp-sourcemaps": "^2.6.0", 16 | "gulp-uglify": "^3.0.0", 17 | "node-sass": "^4.5.3" 18 | }, 19 | "scripts": { 20 | "test": "echo \"Error: no test specified\" && exit 1", 21 | "dev": "browser-sync start --server --files '**/*.js,**/*.html'", 22 | "prod": "webpack", 23 | "postprod": "gulp macSend" 24 | }, 25 | "repository": { 26 | "type": "git", 27 | "url": "" 28 | }, 29 | "author": "chen", 30 | "license": "ISC" 31 | } 32 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | let gulp = require('gulp'); 3 | let sass = require('gulp-sass'); 4 | let sourcemaps = require('gulp-sourcemaps'); 5 | let babel = require('gulp-babel'); 6 | /** 7 | * 编译sass文件 8 | */ 9 | gulp.task('sass', function () { 10 | return gulp.src('./**/*.scss') 11 | .pipe(sourcemaps.init()) 12 | .pipe(sass().on('error', sass.logError)) 13 | .pipe(sourcemaps.write('./maps')) 14 | .pipe(gulp.dest('./dist/css')); 15 | }); 16 | /** 17 | * 编译js文件 18 | */ 19 | gulp.task('es6-js', function () { 20 | //pages下面的业务代码进行babel处理 21 | gulp.src(['./es6-demos/**/*.js']) 22 | .pipe(babel({ 23 | presets: ['es2015'] 24 | })) 25 | .pipe(gulp.dest('./dist/js')); 26 | }); 27 | /** 28 | * 运行任务 29 | */ 30 | gulp.task('default', ['es6-js','sass'], function () { 31 | gulp.watch('./src/js/**/*.js', ['es6-js']); 32 | gulp.watch('./src/sass/**/*.scss', ['sass']); 33 | }); -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 chenhuiYj 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # demos 2 | 个人练习的一些demo，简单的小实例 3 | 4 | ## 使用方式 5 | #### 安装依赖 6 | $ npm install 7 | #### 热刷新 8 | $ browser-sync start --server --files '**/*.js,**/*.html' 9 | 10 | ## 目录说明 11 | 12 | ### vue-demos:基于vue的demos 13 | 14 | blur-text:文字模糊 15 | 16 | nav:滑动导航 17 | 18 | shopping-card:购物车清单 19 | 20 | slider-img:图片轮播 21 | 22 | sudoku:所谓的数独 23 | 24 | tab:选项卡 25 | 26 | todoList:小目标 27 | 28 | ### jquery-demos:基于jquery的demos 29 | 30 | accordion:手风琴 31 | 32 | ancient-poetry:古诗词 33 | 34 | ancient-poetry1：古诗词 35 | 36 | ancient-poetry2：古诗词 37 | 38 | drop：拖拽 39 | 40 | idiom：猜成语 41 | 42 | light-ad：仿电商广告，局部变暗 43 | 44 | magnifier：放大镜效果 45 | 46 | riddle1：谜语 47 | 48 | riddle2：谜语 49 | 50 | slider-3：广告展示，滑动展示 51 | 52 | taobao-ad：防淘宝广告 53 | 54 | tiggle：展开与收起 55 | 56 | ### css3:css3的demos 57 | 58 | smoke-text:烟雾文字 59 | 60 | accordion:手风琴 61 | 62 | marquee:跑马灯 63 | 64 | nav-select:导航下拉 65 | 66 | ### html5:html5的demos 67 | 68 | picker:canvas时钟 69 | 70 | sonw:canvas下雪 71 | 72 | downloadImg:动态生成图片（邀请卡） 73 | 74 | ### es6-demos:es6的demos 75 | 76 | ## 其它说明 77 | 78 | 1.现在的demo都是es5+css写的，gulp的es6和sass的编译没有进行测试过，大家注意下！ 79 | 80 | 2.有些文件引入了vue.min.js，就是说明这个实例是基于vue的。vue的版本是2.2.6 81 | 82 | 3.package.json虽然配置了热刷新的代码，但是直接 npm run dev 没有起到热刷新的效果，一定要按照上图手输。 83 | ## License 84 | ### MIT -------------------------------------------------------------------------------- /css3-demos/smoke-text/smoke-text.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 39 | 40 | 41 |
42 | 守 43 | 候 44 | 的 45 | 个 46 | 人 47 | 文 48 | 章 49 |
50 | 51 | -------------------------------------------------------------------------------- /css3-demos/marquee/marquee.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ec-css无缝滚动 6 | 7 | 32 | 33 | 34 |
35 | 53 |
54 |
55 | 56 | -------------------------------------------------------------------------------- /jquery-demos/accordion.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 手风琴 6 | 7 | 8 | 14 | 21 | 22 | 23 | 24 |
25 | 43 |
44 | 45 | 46 | -------------------------------------------------------------------------------- /vue-demos/blur-text/blur-text.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 7 | 39 | 40 |
41 |

欢迎浏览

42 |
43 | 44 | 68 | -------------------------------------------------------------------------------- /vue-demos/nav/nav-vue.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 7 | 8 | 38 | 39 | 50 | 51 | 52 | 60 | -------------------------------------------------------------------------------- /vue-demos/nav/nav.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 7 | 8 | 37 | 38 | 49 | 50 | 62 | -------------------------------------------------------------------------------- /vue-demos/testdo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 25 | 26 | 27 |
28 |
29 |
30 |
    31 | 32 |
  • 33 | 34 | 35 | 36 |
    • 37 |
38 |
39 |
40 |
41 | 42 | 43 | 44 | 68 | -------------------------------------------------------------------------------- /jquery-demos/drop.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 拖拽 6 | 9 | 53 | 54 | 55 | 56 |
57 | 58 | 59 | -------------------------------------------------------------------------------- /vue-demos/blur-text/blur-text-vue.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 7 | 39 | 40 |
41 |

{{testText}}

42 |
43 | 44 | 45 | 76 | -------------------------------------------------------------------------------- /vue-demos/tab/tab.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 7 | 40 | 41 |
42 |
43 | 44 | html 45 | css 46 | javascript 47 | vue 48 |
49 |
50 | 51 |
52 | html
53 |
54 |
55 | css 56 |
57 |
58 | javascript 59 |
60 |
61 | vue 62 |
63 |
64 |
65 | 66 | 67 | 79 | -------------------------------------------------------------------------------- /html5-demos/snow/snowdemo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Document 6 | 13 | 14 | 15 | 16 | 17 | 请你更新你的浏览器 18 | 19 | 87 | 88 | 89 | 90 | -------------------------------------------------------------------------------- /jquery-demos/magnifier.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 放大镜 6 | 7 | 8 | 14 | 61 | 62 | 63 | 64 |
65 |
66 | 67 |
68 | 71 | 72 | 73 | -------------------------------------------------------------------------------- /jquery-demos/tiggle.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 折叠筛选 7 | 14 | 40 | 41 | 42 | 43 |
44 | 77 |
78 |
79 | 显示全部 80 | 81 | 82 | -------------------------------------------------------------------------------- /jquery-demos/light-ad.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 仿电商局部变暗展示 6 | 7 | 8 | 19 | 27 | 28 | 29 | 30 |
31 | 42 |
43 | 44 |
45 |
46 |
47 | 48 |
49 |
50 | 51 |
52 |
53 |
54 | 55 |
56 |
57 |
58 | 59 |
60 |
61 | 62 |
63 |
64 |
65 | 66 |
67 |
68 |
69 | 70 |
71 |
72 | 73 |
74 |
75 |
76 | 77 | 78 | -------------------------------------------------------------------------------- /html5-demos/picker/picker.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 无标题文档 6 | 9 | 10 | 11 | 12 | 13 | 14 | 97 | 98 | -------------------------------------------------------------------------------- /jquery-demos/riddle1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 猜谜语1 6 | 7 | 12 | 13 | 14 | 15 |

16 |
    17 |
18 | 19 | 106 | 107 | -------------------------------------------------------------------------------- /css3-demos/accordion/accordion.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ec-css手风琴 6 | 7 | 76 | 77 | 78 |
79 | 97 |
98 | 99 | -------------------------------------------------------------------------------- /jquery-demos/riddle2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 猜谜语2 6 | 7 | 11 | 12 | 13 | 14 |
回答正确：
15 | 回答错误：
16 |

17 |
    18 |
19 | 20 | 112 | 113 | -------------------------------------------------------------------------------- /css3-demos/nav-select/nav-select.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ec-css导航栏 6 | 7 | 89 | 90 | 91 |
92 | 126 |
127 |
128 | 129 | -------------------------------------------------------------------------------- /jquery-demos/ancient-poetry2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 猜古诗 6 | 7 | 16 | 17 | 18 | 19 |
20 |

点击下面的文字，写出一句古诗

21 |

22 | 25 | 26 | 89 | 90 | -------------------------------------------------------------------------------- /jquery-demos/idiom.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 猜成语 6 | 7 | 18 | 19 | 20 | 21 |
22 |

根据下面的字，选出各个成语

23 |

24 | 27 | 28 | 111 | 112 | -------------------------------------------------------------------------------- /html5-demos/bubble/main.js: -------------------------------------------------------------------------------- 1 | var self = this 2 | var arr=[]; 3 | $(document).ready(function() { 4 | 5 | var canvas = document.createElement('canvas'); 6 | canvas.id = 'canvas' 7 | canvas.width = self.window.innerWidth 8 | canvas.height = self.window.innerHeight / 2 9 | document.getElementById('drawCanvas').appendChild(canvas) 10 | $('#btn').click(function () { 11 | var ctx = canvas.getContext('2d') 12 | ctx.clearRect(0, 0, canvas.width, canvas.height) 13 | var value = $('#input').val() 14 | loadCanvas(value) 15 | }) 16 | }) 17 | function Bubble(option) { 18 | this.width = self.window.innerWidth 19 | this.height = self.window.innerHeight / 2 20 | this.radius = option.radius || 6 21 | this.color = option.color || '#fff' 22 | this.x = option.x || 0 23 | this.y = option.y || 0 24 | } 25 | Bubble.prototype.draw = function(ctx, randomMove) { 26 | var x, y 27 | x = this.x * 3 + 50, 28 | y = this.y * 3 + 50 29 | ctx.beginPath() 30 | ctx.arc(x, y, this.radius, 0, 2 * Math.PI, false) 31 | ctx.fillStyle = this.color 32 | ctx.fill() 33 | } 34 | 35 | function loadCanvas(value) { 36 | var fontSize = 100, 37 | width = calWordWidth(value, fontSize), 38 | canvas = document.createElement('canvas') 39 | canvas.id = 'b_canvas' 40 | canvas.width = width 41 | canvas.height = fontSize 42 | var ctx = canvas.getContext('2d') 43 | ctx.font = fontSize + "px Microsoft YaHei" 44 | ctx.fillStyle = "orange" 45 | ctx.fillText(value, 0, fontSize / 5 * 4) //轻微调整绘制字符位置 46 | getImage(canvas, ctx) //导出为图片再导入到canvas获取图像数据 47 | } 48 | function getImage(canvas, ctx) { 49 | var image = new Image() 50 | image.src = canvas.toDataURL("image/jpeg") 51 | image.onload = function() { 52 | ctx.clearRect(0, 0, canvas.width, canvas.height) 53 | ctx.drawImage(image, 0, 0, this.width, this.height) 54 | var imageData = ctx.getImageData(0, 0, this.width, this.height) 55 | var diff = 4 56 | var newCanvas = document.getElementById('canvas') 57 | var newCtx = newCanvas.getContext('2d') 58 | for (var j = 0; j < this.height; j += diff) { 59 | for (var i = 0; i < this.width; i += diff) { 60 | var colorNum = 0 61 | for (var k = 0; k < diff * diff; k++) { 62 | var row = k % diff 63 | var col = ~~(k / diff) 64 | var r = imageData.data[((j + col) * this.width + i + row) * 4 + 0] 65 | var g = imageData.data[((j + col) * this.width + i + row) * 4 + 1] 66 | var b = imageData.data[((j + col) * this.width + i + row) * 4 + 2] 67 | if (r < 10 && g < 10 && b < 10) colorNum++ 68 | //如果满足此条件说明当前为背景色黑色（canvas转出来的图片背景并不是纯黑的 69 | } 70 | //黑色背景占比小于一定程度说明此处应该画粒子，占比度可自行调整 71 | 72 | //画粒子 73 | if (colorNum < diff * diff / 3 * 2) { 74 | var option = { 75 | x: i, 76 | y: j, 77 | radius: 4, 78 | color: '#fff' 79 | }; 80 | arr.push(option); 81 | var newBubble = new Bubble(option); 82 | newBubble.draw(newCtx) 83 | } 84 | } 85 | } 86 | // document.getElementById('body').appendChild(canvas) //离屏canvas展现到界面中看到渲染效果 87 | } 88 | } 89 | function darwDo() { 90 | ctx.clearRect(0, 0, canvas.width, canvas.height) 91 | for(var i=0;i 2 | 3 | 4 | 5 | Title 6 | 7 | 61 | 62 | 63 |
64 | 65 | 73 |
74 | 75 |
76 |
77 |
78 |
79 |
80 |
81 | 82 | 83 | 130 | -------------------------------------------------------------------------------- /vue-demos/slider-img/slider-img.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 7 | 61 | 62 | 63 |
64 | 65 | 72 |
73 | 74 | 75 | 76 | 77 |
78 |
79 |
80 |
81 |
82 |
83 | 84 | 135 | -------------------------------------------------------------------------------- /jquery-demos/slider-3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 滑动展示 6 | 7 | 8 | 55 | 74 | 75 | 76 | 77 |
78 |
79 |

卡通动漫

80 |
81 |
82 | 83 | 84 | 85 |
86 | 更多>> 87 |
88 |
89 |
90 |
91 | 105 |
106 |
107 |
108 | 109 | 110 | -------------------------------------------------------------------------------- /jquery-demos/js/subject1.js: -------------------------------------------------------------------------------- 1 | var sNumberTips=['请点击下列文字，组成一句五言诗句','请点击下列文字，组成一句七言诗句','根据下列题目，选择并点击正确答案','根据诗句，点击下列文字，填补完整诗句的“*”处空缺','请在文本框内输入空缺的一诗句，输入完成后点击按钮']; 2 | var sFive=['孤舟蓑笠翁独钓寒江雪','但愿人长久千里共婵娟','此中有真意欲辨已忘言','欲穷千里目更上一层楼','夕阳无限好只是近黄昏','海内存知己天涯若比邻','柴门闻犬吠风雪夜归人','夜来风雨声花落知多少','锄禾日当午汗滴禾下土','生当作人杰死亦为鬼雄','床前明月光疑是地上霜','举杯邀明月对影成三人','野旷天低树江清月近人','只在此山中云深不知处','春草明年绿王孙归不归','深林人不知明月来相照','千山鸟飞绝万径人踪灭','野火烧不尽春风吹又生','荡胸生层云决眦入归鸟','会当凌绝顶一览众山小','春眠不觉晓处处闻啼鸟','白日依山尽黄河入海流','举头望明月低头思故乡','随风潜入夜润物细无声','好雨知时节当春乃发生','谁知盘中餐粒粒皆辛苦','本是同根生相煎何太急','慈母手中线游子身上衣','谁言寸草心报得三春晖','随意春芳歇王孙自可留','空山新雨后天气晚来秋','明月松间照清泉石上流','感时花溅泪恨别鸟惊心','烽火连三月家书抵万金','国破山河在城春草木深','亲朋无一字老病有孤舟','戎马关山北凭轩涕泗流','海日生残夜江春入旧年','乡书何处达归雁洛阳边','待到重阳日还来就菊花','大漠孤烟直长河落日圆','海上生明月天涯共此时','半壁见海日空中闻天鸡','愿君多采撷此物最相思','愿得一人心白首不相离','月上柳梢头人约黄昏后','久在樊笼里复得返自然','落地为兄弟何必骨肉亲','问君何能尔心远地自偏','少壮不努力老大徒伤悲','鸟宿池边树僧敲月下门','人闲桂花落夜静春山空','无意苦争春一任群芳妒','种豆南山下草盛豆苗稀','乱山残雪夜孤烛异乡人','明月几时有把酒问青天','采菊东篱下悠然见南山','山气日夕佳飞鸟相与还','昔闻洞庭水今上岳阳楼','人家在何许云外一声鸡','青山依旧在几度夕阳红','野火烧不尽春风吹又生','百川东到海何时复西归','空山松子落幽人应未眠','近乡情更怯不敢问来人','挥手自兹去萧萧班马鸣','少无适俗韵性本爱丘山','开轩面场圃把酒话桑麻','相顾无相识长歌怀采薇','南国有佳人容华若桃李','山中相送罢日暮掩柴扉','至今思项羽不肯过江东','牧童骑黄牛歌声振林樾','意欲捕鸣蝉忽然闭口立','月出惊山鸟时鸣春涧中','相看两不厌只有敬亭山','城阙辅三秦风烟望五津','飘飘何所似天地一沙鸥','墙角数枝梅凌寒独自开','君自故乡来应知故乡事','青山横北郭白水绕东城','此地一为别孤蓬万里征','念此私自愧尽日不能忘','足蒸暑土气背灼炎天光','力尽不知热但惜夏日长','结庐在人境而无车马喧','天地有正气杂然赋流形','潮平两岸阔风正一帆悬','一点浩然气千里快哉风','仍怜故乡水万里送行舟','四海无闲田农夫犹饿死','羁鸟恋旧林池鱼思故渊','开荒南野际守拙归园田','晨兴理荒秽带月荷锄归','道狭草木长夕露沾我衣','衣沾不足惜但使愿无违','无为在岐路儿女共沾巾','萁在釜下燃豆在釜中泣','晚来天欲雪能饮一杯无','浮云游子意落日故人情','荷笠带斜阳青山独归远','笔落惊风雨诗成泣鬼神','白头搔更短浑欲不胜簪','露从今夜白月是故乡明','月下飞天镜云生结海楼','落花人独立微雨燕双飞','移舟泊烟渚日暮客愁新','空山不见人但闻人语响','春种一粒粟秋收万颗籽','造化钟神秀阴阳割昏晓','遥知不是雪为有暗香来','终南阴岭秀积雪浮云端','牧童骑黄牛林樾歌声振','此地别燕丹壮士发冲冠','昔时人已没今日水犹寒','江上往来人但爱鲈鱼美','君看一叶舟出没风波里','昔去雪如花今来花似雪','一去二三里烟村四五家','亭台六七座八九十枝花','远看山有色近听水无声','春去花还在人来鸟不惊','草木有本心何求美人折','鱼游乐深池鸟栖欲高枝','气蒸云梦泽波撼岳阳城','坐观垂钓者徒有羡鱼情','绿树村边合青山郭外斜','故人具鸡黍邀我至田家']; 3 | var sSeven=['南朝四百八十寺多少楼台烟雨中','人生自古谁无死留取丹心照汗青','同是天涯沦落人相逢何必曾相识','忽如一夜春风来千树万树梨花开','两情若是久长时又岂在朝朝暮暮','落红不是无情物化作春泥更护花','江畔何人初见月江月何年初照人','先天下之忧而忧后天下之乐而乐','在天愿作比翼鸟在地愿为连理枝','天长地久有时尽此恨绵绵无绝期','独在异乡为异客每逢佳节倍思亲','山重水复疑无路柳暗花明又一村','长风破浪会有时直挂云帆济沧海','身无彩凤双飞翼心有灵犀一点通','两岸猿声啼不住轻舟已过万重山','桃花潭水深千尺不及汪伦送我情','儿童相见不相识笑问客从何处来','月落乌啼霜满天江枫渔火对愁眠','商女不知亡国恨隔江犹唱后庭花','清明时节雨纷纷路上行人欲断魂','秦时明月汉时关万里长征人未还','劝君更尽一杯酒西出阳关无故人','正是江南好风景落花时节又逢君','不识庐山真面目只缘身在此山中','窗含西岭千秋雪门泊东吴万里船','孤帆远影碧空尽唯见长江天际流','莫愁前路无知己天下谁人不识君','曾经沧海难为水除却巫山不是云','一骑红尘妃子笑无人知是荔枝来','人面不知何处去桃花依旧笑春风','侯门一入深似海从此萧郎是路人','黄鹤一去不复返白云千载空悠悠','出师未捷身先死长使英雄泪满襟','此情可待成追忆只是当时已惘然','东风不与周郎便铜雀春深锁二乔','红军不怕远征难万水千山只等闲','无边落木萧萧下不尽长江滚滚来','千呼万唤始出来犹抱琵琶半遮面','别有幽愁暗恨生此时无声胜有声','朝辞白帝彩云间千里江陵一日还','故人西辞黄鹤楼烟花三月下扬州','借问酒家何处有牧童遥指杏花村','接天莲叶无穷碧映日荷花别样红','沉舟侧畔千帆过病树前头万木春','春色满园关不住一枝红杏出墙来','天街小雨润如酥草色遥看近却无','最是一年春好处绝胜烟柳满皇都','衣带渐宽终不悔为伊消得人憔悴','回眸一笑百媚生六宫粉黛无颜色','杨花落尽子规啼闻道龙标过五溪','我寄愁心与明月随风直到夜郎西','天生我材必有用千金散尽还复来','黄沙百战穿金甲不破楼兰终不还','相见时难别亦难东风无力百花残','春蚕到死丝方尽蜡炬成灰泪始干','东边日出西边雨道是无晴却有晴','天涯地角有穷时只有相思无尽处','停车坐爱枫林晚霜叶红于二月花','江东子弟多才俊卷土重来未可知','远上寒山石径斜白云深处有人家','千里莺啼绿映红水村山郭酒旗风','不畏浮云遮望眼自缘身在最高层','三更灯火五更鸡正是男儿读书时','几处早莺争暖树谁家新燕啄春泥','最爱湖东行不足绿杨阴里白沙堤','等闲识得东风面万紫千红总是春','春江潮水连海平海上明月共潮生','春风得意马蹄疾一日看尽长安花','不知细叶谁裁出二月春风似剪刀','爆竹声中一岁除春风送暖入屠苏','千门万户曈曈日总把新桃换旧符','问渠那得清如许为有源头活水来','春宵一刻值千金花有清香月有阴','竹外桃花三两枝春江水暖鸭先知','咬定青山不放松立根原在破岩中','千磨万击还坚劲任尔东西南北风','一道残阳铺水中半江瑟瑟半江红','小荷才露尖尖角早有蜻蜓立上头','春风又绿江南岸明月何时照我还','洛阳亲友如相问一片冰心在玉壶','令公桃李满天下何用堂前更种花','胡雁哀鸣夜夜飞胡儿眼泪双双落','羌笛何须怨杨柳春风不度玉门关','漠漠水田飞白鹭阴阴夏木啭黄鹂','小楼一夜听春雨深巷明朝卖杏花','冰雪林中著此身不同桃李混芳尘','春风十里扬州路卷上珠帘总不如','草长莺飞二月天拂堤杨柳醉春烟','儿童散学归来早忙趁东风放纸鸢','黄梅时节家家雨青草池塘处处蛙','有约不来过夜半闲敲棋子落灯花','去年今日此门中人面桃花相映红','昨夜星辰昨夜风画楼西畔桂堂东','日出江花红胜火春来江水绿如蓝','烟笼寒水月笼沙夜泊秦淮近酒家','日暮乡关何处是烟波江上使人愁','近水楼台先得月向阳花木易为春','落霞与孤鹜齐飞秋水共长天一色','风急天高猿啸哀渚清沙白鸟飞回','江山代有才人出各领风骚数百年','旧巢共是衔泥燕飞上枝头变凤凰','无可奈何花落去似曾相识雁归来','东边日出西边雨道是无晴还有晴','沧海月明珠有泪蓝田日暖玉生烟','花开堪折直须折莫待无花空折枝','不是花中偏爱菊此花开尽更无花','黄四娘家花满蹊千朵万朵压枝低','留连戏蝶时时舞自在娇莺恰恰啼','人间四月芳菲尽山寺桃花始盛开','仰天大笑出门去我辈岂是蓬蒿人','凤凰台上凤凰游凤去台空江自流','桃李春风一杯酒江湖夜雨十年灯','夜阑卧听风吹雨铁马冰河入梦来','但使龙城飞将在不教胡马度阴山','寂寞空庭春欲晚梨花满地不开门','沾衣欲湿杏花雨吹面不寒杨柳风','纸上得来终觉浅绝知此事要躬行','出师一表真名世千载谁堪伯仲间','欲把西湖比西子淡妆浓抹总相宜','春潮带雨晚来急野渡无人舟自横','姑苏城外寒山寺夜半钟声到客船','山外青山楼外楼西湖歌舞几时休','西塞山前白鹭飞桃花流水鳜鱼肥','抽刀断水水更流举杯消愁愁更愁','可怜九月初三夜露似真珠月似弓','白日放歌须纵酒青春作伴好还乡','却看妻子愁何在漫卷诗书喜欲狂','昼出耘田夜绩麻村庄儿女各当家','童孙未解供耕织也傍桑阴学种瓜','毕竟西湖六月中风光不与四时同','千里黄云白日曛北风吹雁雪纷纷','十年一觉扬州梦赢得青楼薄幸名','路人借问遥招手怕得鱼惊不应人','萧萧梧叶送寒声江上秋风动客情','万里悲秋常作客百年多病独登台','艰难苦恨繁霜鬓潦倒新停浊酒杯','飞来山上千寻塔闻说鸡鸣见日升','恸哭六军俱缟素冲冠一怒为红颜','大鹏一日同风起扶摇直上九万里','庄生晓梦迷蝴蝶望帝春心托杜鹃','晴空一鹤排云上便引诗情到碧霄','春江花朝秋月夜往往取酒还独倾','云想衣裳花想容春风拂槛露华浓','瀚海阑干百丈冰愁云惨淡万里凝','江东子弟多才俊卷土重来未可知','昨夜闲潭梦落花可怜春半不还家','今夜偏知春气暖虫声新透绿窗纱','二十四桥明月夜玉人何处教吹箫','斜月沉沉藏海雾碣石潇湘无限路','人生代代无穷已江月年年望相似','不知江月待何人但见长江送流水','谁家今夜扁舟子何处相思明月楼','我闻琵琶已叹息又闻此语重唧唧','今年欢笑复明年秋月春风等闲度','中庭地白树栖鸦冷露无声湿桂花','浔阳江头夜送客枫叶荻花秋瑟瑟','孤山寺北贾亭西水面初平云脚低','乱花渐欲迷人眼浅草才能没马蹄','遥知兄弟登高处遍插茱萸少一人','朱雀桥边野草花乌衣巷口夕阳斜','旧时王谢堂前燕飞入寻常百姓家','积雨空林烟火迟蒸藜炊黍饷东菑','野老与人争席罢海鸥何事更相疑','塞下秋来风景异衡阳雁去无留意','燕子不归春事晚一汀烟雨杏花寒','独怜幽草涧边生上有黄鹂深树鸣','碧玉妆成一树高万条垂下绿丝绦']; 4 | var chooseArr=[ 5 | {'question':'“八百里分麾下灸，五十弦翻塞外声中”，“八百里”指的是？','answer':['八百公里','牛的代称','古代将领名'],'truec':1}, 6 | {'question':'“日照香炉生紫烟，遥看瀑布挂前川中”，“香炉”指的是?','answer':['香炉峰','祭拜焚香的鼎','香炉殿'],'truec':0}, 7 | {'question':'李白笔下“飞流直三千尺，疑银河落九天”指哪风景区?','answer':['华山','黄山','庐山'],'truec':2}, 8 | {'question':'“谁言寸草心，草报三春晖”表达思想情是？','answer':['友谊情深','母子情深','爱国之情'],'truec':1}, 9 | {'question':'“但使龙城飞将在，不教胡马度阴山”中的“龙城飞将”指的是？','answer':['汉朝名将霍去病','汉朝名将李广','赵国名将廉颇'],'truec':1}, 10 | {'question':'“春城无处不飞花，寒食东风御柳斜。” 寒食节即我国传统的？','answer':['春节','端午节','清明节'],'truec':2}, 11 | {'question':'以下哪一句是宋代诗人王安石《泊船瓜洲》中的名句？','answer':['春风又绿江南岸','春江水暖鸭先知','春风送暖入屠苏'],'truec':0}, 12 | {'question':'以下最能表达诗人和老朋友依依惜别的诗句是？','answer':['落花时节又逢君','劝君更尽一杯酒','青春作伴好还乡'],'truec':1}, 13 | {'question':'“天阶夜色凉如水，卧看牵牛织女星。”出自？','answer':['杜牧《秋夕》','白居易《忆江南》','杜甫《江南逢李龟年》'],'truec':0}, 14 | {'question':'刘禹锡的《酬乐天扬州初逢席上见赠》中，乐天指的是？','answer':['杜甫','白居易','李白'],'truec':1}, 15 | {'question':'李白笔下“杨花落尽子规啼，闻道龙标过五溪”中，子规指的是什么鸟？','answer':['画眉','喜鹊','杜鹃'],'truec':2}, 16 | {'question':'杜牧笔下“东风不与周郎便，铜雀春深锁二乔”中，铜雀台由何人所建？','answer':['曹操','曹丕','曹植'],'truec':0}, 17 | {'question':'杜甫的著名诗句“会当凌绝顶,一览众山小”形容的是？','answer':['安徽黄山','江西庐山','山东泰山'],'truec':2}, 18 | {'question':'“姑苏城外寒山寺,夜半钟声到客船”中的“寒山寺”位于？','answer':['山西省 ','浙江省','江苏省'],'truec':1}, 19 | {'question':'“何当共剪西窗烛，却话巴山夜雨时”中的“剪烛”目的是？','answer':['调暗烛光 ','调亮烛光','熄灭蜡烛'],'truec':1}, 20 | 21 | {'question':'下列哪位诗人凭借哪首诗，赢得了“孤篇盖全唐”的美誉？','answer':['陈子昂《登幽州台歌》 ','张若虚《春江花月夜》','杨炯《从军行》'],'truec':1}, 22 | {'question':'远看山有色，近听水无声。春去花还在，人来鸟不惊。 这首诗描写的是？','answer':['春天的景色 ','想象的景色','画中的景色'],'truec':2}, 23 | {'question':'辛弃疾笔下“蓦然回首，那人却在，灯火阑珊处”。 灯火阑珊处指的是？','answer':['灯光充足的地方 ','灯光昏暗的地方','没有灯光的地方'],'truec':1}, 24 | {'question':'下列哪句诗，描写的节日不是中秋节？','answer':['月上柳梢头，人约黄昏后 ','但愿人长久，千里共婵娟','海上生明月，天涯共此时'],'truec':0}, 25 | {'question':'下列哪句诗的雪，不是真正的雪？','answer':['孤舟蓑笠翁，独钓寒江雪','忽如一夜春风来，千树万树梨花开','柴门闻犬吠，风雪夜归人'],'truec':0}, 26 | {'question':'下列哪句诗描写的是春天的意象？','answer':['小荷才露尖尖角，早有蜻蜓立上头','忽如一夜春风来，千树万树梨花开','窗含西岭千秋雪，门泊东吴万里船'],'truec':2} 27 | ] 28 | -------------------------------------------------------------------------------- /vue-demos/todoList/todoList.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 27 | 28 | 29 |
30 |

小目标列表

31 |
32 |

添加小目标

33 | 34 | 35 |

共有{{prolist.length}}个目标，{{noend==0?"全部完成了":'已完成'+(prolist.length-noend)+'，还有'+noend+'条未完成'}}

36 |

37 | 38 | 39 | 40 |

41 |
42 | 52 |
53 | 54 | 55 | 148 | -------------------------------------------------------------------------------- /jquery-demos/taobao-ad.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 仿淘宝广告 6 | 7 | 8 | 84 | 96 | 97 | 98 | 99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 |
115 |
116 |
117 |
118 |
119 |
120 |
121 |
122 |
123 |
124 |
    125 |
    • 126 |
    • 127 |
    • 128 |
    • 129 |
    • 130 |
    • 131 |
    • 132 |
    • 133 |
    • 134 |
    • 135 |
    • 136 |
    • 137 |
    • 138 |
    • 139 |
    • 140 |
    • 141 |
    • 142 |
    • 143 |
    • 144 |
    • 145 |
146 |
147 |
148 |
149 | 150 | 151 | -------------------------------------------------------------------------------- /jquery-demos/js/subject.js: -------------------------------------------------------------------------------- 1 | var sNumberTips=['请点击下列文字，组成一句五言诗句','请点击下列文字，组成一句七言诗句','根据下列题目，选择并点击正确答案','根据诗句，点击下列文字，填补完整诗句的“*”处空缺','请在文本框内输入空缺的一诗句，输入完成后点击按钮']; 2 | var sFive=['孤,舟,蓑,笠,翁,独,钓,寒,江,雪','但,愿,人,长,久,千,里,共,婵,娟','此,中,有,真,意,欲,辨,已,忘,言','欲,穷,千,里,目,更,上,一,层,楼','夕,阳,无,限,好,只,是,近,黄,昏','海,内,存,知,己,天,涯,若,比,邻','柴,门,闻,犬,吠,风,雪,夜,归,人','夜,来,风,雨,声,花,落,知,多,少','锄,禾,日,当,午,汗,滴,禾,下,土','生,当,作,人,杰,死,亦,为,鬼,雄','床,前,明,月,光,疑,是,地,上,霜','举,杯,邀,明,月,对,影,成,三,人','野,旷,天,低,树,江,清,月,近,人','只,在,此,山,中,云,深,不,知,处','春,草,明,年,绿,王,孙,归,不,归','深,林,人,不,知,明,月,来,相,照','千,山,鸟,飞,绝,万,径,人,踪,灭','野,火,烧,不,尽,春,风,吹,又,生','荡,胸,生,层,云,决,眦,入,归,鸟','会,当,凌,绝,顶,一,览,众,山,小','春,眠,不,觉,晓,处,处,闻,啼,鸟','白,日,依,山,尽,黄,河,入,海,流','举,头,望,明,月,低,头,思,故,乡','随,风,潜,入,夜,润,物,细,无,声','好,雨,知,时,节,当,春,乃,发,生','谁,知,盘,中,餐,粒,粒,皆,辛,苦','本,是,同,根,生,相,煎,何,太,急','慈,母,手,中,线,游,子,身,上,衣','谁,言,寸,草,心,报,得,三,春,晖','随,意,春,芳,歇,王,孙,自,可,留','空,山,新,雨,后,天,气,晚,来,秋','明,月,松,间,照,清,泉,石,上,流','感,时,花,溅,泪,恨,别,鸟,惊,心','烽,火,连,三,月,家,书,抵,万,金','国,破,山,河,在,城,春,草,木,深','亲,朋,无,一,字,老,病,有,孤,舟','戎,马,关,山,北,凭,轩,涕,泗,流','海,日,生,残,夜,江,春,入,旧,年','乡,书,何,处,达,归,雁,洛,阳,边','待,到,重,阳,日,还,来,就,菊,花','大,漠,孤,烟,直,长,河,落,日,圆','海,上,生,明,月,天,涯,共,此,时','半,壁,见,海,日,空,中,闻,天,鸡','愿,君,多,采,撷,此,物,最,相,思','愿,得,一,人,心,白,首,不,相,离','月,上,柳,梢,头,人,约,黄,昏,后','久,在,樊,笼,里,复,得,返,自,然','落,地,为,兄,弟,何,必,骨,肉,亲','问,君,何,能,尔,心,远,地,自,偏','少,壮,不,努,力,老,大,徒,伤,悲','鸟,宿,池,边,树,僧,敲,月,下,门','人,闲,桂,花,落,夜,静,春,山,空','无,意,苦,争,春,一,任,群,芳,妒','种,豆,南,山,下,草,盛,豆,苗,稀','乱,山,残,雪,夜,孤,烛,异,乡,人','明,月,几,时,有,把,酒,问,青,天','采,菊,东,篱,下,悠,然,见,南,山','山,气,日,夕,佳,飞,鸟,相,与,还','昔,闻,洞,庭,水,今,上,岳,阳,楼','人,家,在,何,许,云,外,一,声,鸡','青,山,依,旧,在,几,度,夕,阳,红','空,山,不,见,人, 但,闻,人,语,响','野,火,烧,不,尽, 春,风,吹,又,生','百,川,东,到,海, 何,时,复,西,归','空,山,松,子,落,幽,人,应,未,眠','近,乡,情,更,怯,不,敢,问,来,人','挥,手,自,兹,去,萧,萧,班,马,鸣','少,无,适,俗,韵,性,本,爱,丘,山','开,轩,面,场,圃,把,酒,话,桑,麻','相,顾,无,相,识,长,歌,怀,采,薇','南,国,有,佳,人,容,华,若,桃,李','山,中,相,送,罢,日,暮,掩,柴,扉','至,今,思,项,羽,不,肯,过,江,东','牧,童,骑,黄,牛,歌,声,振,林,樾','意,欲,捕,鸣,蝉,忽,然,闭,口,立','月,出,惊,山,鸟,时,鸣,春,涧,中','相,看,两,不,厌,只,有,敬,亭,山','城,阙,辅,三,秦,风,烟,望,五,津','飘,飘,何,所,似,天,地,一,沙,鸥','墙,角,数,枝,梅,凌,寒,独,自,开','君,自,故,乡,来,应,知,故,乡,事','青,山,横,北,郭,白,水,绕,东,城','此,地,一,为,别,孤,蓬,万,里,征','念,此,私,自,愧,尽,日,不,能,忘','足,蒸,暑,土,气,背,灼,炎,天,光','力,尽,不,知,热,但,惜,夏,日,长','结,庐,在,人,境,而,无,车,马,喧','天,地,有,正,气,杂,然,赋,流,形','潮,平,两,岸,阔,风,正,一,帆,悬','一,点,浩,然,气,千,里,快,哉,风','仍,怜,故,乡,水,万,里,送,行,舟','四,海,无,闲,田,农,夫,犹,饿,死','羁,鸟,恋,旧,林,池,鱼,思,故,渊','开,荒,南,野,际,守,拙,归,园,田','晨,兴,理,荒,秽,带,月,荷,锄,归','道,狭,草,木,长,夕,露,沾,我,衣','衣,沾,不,足,惜,但,使,愿,无,违','无,为,在,岐,路,儿,女,共,沾,巾','萁,在,釜,下,燃,豆,在,釜,中,泣','晚,来,天,欲,雪,能,饮,一,杯,无','浮,云,游,子,意,落,日,故,人,情','荷,笠,带,斜,阳,青,山,独,归,远']; 3 | var sSeven=['南,朝,四,百,八,十,寺,多,少,楼,台,烟,雨,中','人,生,自,古,谁,无,死,留,取,丹,心,照,汗,青','同,是,天,涯,沦,落,人,相,逢,何,必,曾,相,识','忽,如,一,夜,春,风,来,千,树,万,树,梨,花,开','两,情,若,是,久,长,时,又,岂,在,朝,朝,暮,暮','落,红,不,是,无,情,物,化,作,春,泥,更,护,花','江,畔,何,人,初,见,月,江,月,何,年,初,照,人','先,天,下,之,忧,而,忧,后,天,下,之,乐,而,乐','在,天,愿,作,比,翼,鸟,在,地,愿,为,连,理,枝','天,长,地,久,有,时,尽,此,恨,绵,绵,无,绝,期','独,在,异,乡,为,异,客,每,逢,佳,节,倍,思,亲','山,重,水,复,疑,无,路,柳,暗,花,明,又,一,村','长,风,破,浪,会,有,时,直,挂,云,帆,济,沧,海','身,无,彩,凤,双,飞,翼,心,有,灵,犀,一,点,通','两,岸,猿,声,啼,不,住,轻,舟,已,过,万,重,山','桃,花,潭,水,深,千,尺,不,及,汪,伦,送,我,情','儿,童,相,见,不,相,识,笑,问,客,从,何,处,来','月,落,乌,啼,霜,满,天,江,枫,渔,火,对,愁,眠','商,女,不,知,亡,国,恨,隔,江,犹,唱,后,庭,花','清,明,时,节,雨,纷,纷,路,上,行,人,欲,断,魂','秦,时,明,月,汉,时,关,万,里,长,征,人,未,还','劝,君,更,尽,一,杯,酒,西,出,阳,关,无,故,人','正,是,江,南,好,风,景,落,花,时,节,又,逢,君','不,识,庐,山,真,面,目,只,缘,身,在,此,山,中','窗,含,西,岭,千,秋,雪,门,泊,东,吴,万,里,船','孤,帆,远,影,碧,空,尽,唯,见,长,江,天,际,流','莫,愁,前,路,无,知,己,天,下,谁,人,不,识,君','曾,经,沧,海,难,为,水,除,却,巫,山,不,是,云','一,骑,红,尘,妃,子,笑,无,人,知,是,荔,枝,来','人,面,不,知,何,处,去,桃,花,依,旧,笑,春,风','侯,门,一,入,深,似,海,从,此,萧,郎,是,路,人','黄,鹤,一,去,不,复,返,白,云,千,载,空,悠,悠','出,师,未,捷,身,先,死,长,使,英,雄,泪,满,襟','此,情,可,待,成,追,忆,只,是,当,时,已,惘,然','东,风,不,与,周,郎,便,铜,雀,春,深,锁,二,乔','红,军,不,怕,远,征,难,万,水,千,山,只,等,闲','无,边,落,木,萧,萧,下,不,尽,长,江,滚,滚,来','千,呼,万,唤,始,出,来,犹,抱,琵,琶,半,遮,面','别,有,幽,愁,暗,恨,生,此,时,无,声,胜,有,声','朝,辞,白,帝,彩,云,间,千,里,江,陵,一,日,还','故,人,西,辞,黄,鹤,楼,烟,花,三,月,下,扬,州','借,问,酒,家,何,处,有,牧,童,遥,指,杏,花,村','接,天,莲,叶,无,穷,碧,映,日,荷,花,别,样,红','沉,舟,侧,畔,千,帆,过,病,树,前,头,万,木,春','春,色,满,园,关,不,住,一,枝,红,杏,出,墙,来','天,街,小,雨,润,如,酥,草,色,遥,看,近,却,无','最,是,一,年,春,好,处,绝,胜,烟,柳,满,皇,都','衣,带,渐,宽,终,不,悔,为,伊,消,得,人,憔,悴','回,眸,一,笑,百,媚,生,六,宫,粉,黛,无,颜,色','杨,花,落,尽,子,规,啼,闻,道,龙,标,过,五,溪','我,寄,愁,心,与,明,月,随,风,直,到,夜,郎,西','天,生,我,材,必,有,用,千,金,散,尽,还,复,来','黄,沙,百,战,穿,金,甲,不,破,楼,兰,终,不,还','相,见,时,难,别,亦,难,东,风,无,力,百,花,残','春,蚕,到,死,丝,方,尽,蜡,炬,成,灰,泪,始,干','东,边,日,出,西,边,雨,道,是,无,晴,却,有,晴','天,涯,地,角,有,穷,时,只,有,相,思,无,尽,处','停,车,坐,爱,枫,林,晚,霜,叶,红,于,二,月,花','江,东,子,弟,多,才,俊, 卷,土,重,来,未,可,知','远,上,寒,山,石,径,斜,白,云,深,处,有,人,家','千,里,莺,啼,绿,映,红,水,村,山,郭,酒,旗,风','不,畏,浮,云,遮,望,眼,自,缘,身,在,最,高,层','三,更,灯,火,五,更,鸡,正,是,男,儿,读,书,时','几,处,早,莺,争,暖,树,谁,家,新,燕,啄,春,泥','最,爱,湖,东,行,不,足,绿,杨,阴,里,白,沙,堤','等,闲,识,得,东,风,雨,万,紫,千,红,总,是,春','春,江,潮,水,连,海,平,海,上,明,月,共,潮,生','春,风,得,意,马,蹄,疾,一,日,看,尽,长,安,花','不,知,细,叶,谁,裁,出,二,月,春,风,似,剪,刀','爆,竹,声,中,一,岁,除,春,风,送,暖,入,屠,苏','千,门,万,户,曈,曈,日,总,把,新,桃,换,旧,符','问,渠,那,得,清,如,许,为,有,源,头,活,水,来','春,宵,一,刻,值,千,金,花,有,清,香,月,有,阴','竹,外,桃,花,三,两,枝,春,江,水,暖,鸭,先,知','咬,定,青,山,不,放,松,立,根,原,在,破,岩,中','千,磨,万,击,还,坚,劲,任,尔,东,西,南,北,风','一,道,残,阳,铺,水,中,半,江,瑟,瑟,半,江,红','小,荷,才,露,尖,尖,角,早,有,蜻,蜓,立,上,头','春,风,又,绿,江,南,岸,明,月,何,时,照,我,还','洛,阳,亲,友,如,相,问,一,片,冰,心,在,玉,壶','令,公,桃,李,满,天,下,何,用,堂,前,更,种,花','胡,雁,哀,鸣,夜,夜,飞,胡,儿,眼,泪,双,双,落','羌,笛,何,须,怨,杨,柳,春,风,不,度,玉,门,关','漠,漠,水,田,飞,白,鹭,阴,阴,夏,木,啭,黄,鹂','小,楼,一,夜,听,春,雨,深,巷,明,朝,卖,杏,花','冰,雪,林,中,著,此,身,不,同,桃,李,混,芳,尘','春,风,十,里,扬,州,路,卷,上,珠,帘,总,不,如','草,长,莺,飞,二,月,天,拂,堤,杨,柳,醉,春,烟','儿,童,散,学,归,来,早,忙,趁,东,风,放,纸,鸢','黄,梅,时,节,家,家,雨,青,草,池,塘,处,处,蛙','有,约,不,来,过,夜,半,闲,敲,棋,子,落,灯,花','去,年,今,日,此,门,中,人,面,桃,花,相,映,红','昨,夜,星,辰,昨,夜,风,画,楼,西,畔,桂,堂,东','日,出,江,花,红,胜,火,春,来,江,水,绿,如,蓝','烟,笼,寒,水,月,笼,沙,夜,泊,秦,淮,近,酒,家','日,暮,乡,关,何,处,是,烟,波,江,上,使,人,愁','近,水,楼,台,先,得,月,向,阳,花,木,易,为,春','落,霞,与,孤,鹜,齐,飞,秋,水,共,长,天,一,色','风,急,天,高,猿,啸,哀,渚,清,沙,白,鸟,飞,回','江,山,代,有,才,人,出,各,领,风,骚,数,百,年','旧,巢,共,是,衔,泥,燕,飞,上,枝,头,变,凤,凰','无,可,奈,何,花,落,去,似,曾,相,识,雁,归,来','东,边,日,出,西,边,雨,道,是,无,晴,还,有,晴','沧,海,月,明,珠,有,泪,蓝,田,日,暖,玉,生,烟','花,开,堪,折,直,须,折,莫,待,无,花,空,折,枝','不,是,花,中,偏,爱,菊,此,花,开,尽,更,无,花','黄,四,娘,家,花,满,蹊,千,朵,万,朵,压,枝,低','留,连,戏,蝶,时,时,舞,自,在,娇,莺,恰,恰,啼','人,间,四,月,芳,菲,尽,山,寺,桃,花,始,盛,开','仰,天,大,笑,出,门,去,我,辈,岂,是,蓬,蒿,人','凤,凰,台,上,凤,凰,游,凤,去,台,空,江,自,流','桃,李,春,风,一,杯,酒,江,湖,夜,雨,十,年,灯','夜,阑,卧,听,风,吹,雨,铁,马,冰,河,入,梦,来','但,使,龙,城,飞,将,在,不,教,胡,马,度,阴,山','寂,寞,空,庭,春,欲,晚,梨,花,满,地,不,开,门','沾,衣,欲,湿,杏,花,雨,吹,面,不,寒,杨,柳,风','纸,上,得,来,终,觉,浅,绝,知,此,事,要,躬,行','出,师,一,表,真,名,世,千,载,谁,堪,伯,仲,间','欲,把,西,湖,比,西,子,淡,妆,浓,抹,总,相,宜','春,潮,带,雨,晚,来,急,野,渡,无,人,舟,自,横','姑,苏,城,外,寒,山,寺,夜,半,钟,声,到,客,船','山,外,青,山,楼,外,楼,西,湖,歌,舞,几,时,休','西,塞,山,前,白,鹭,飞,桃,花,流,水,鳜,鱼,肥','抽,刀,断,水,水,更,流,举,杯,消,愁,愁,更,愁','可,怜,九,月,初,三,夜,露,似,真,珠,月,似,弓','白,日,放,歌,须,纵,酒,青,春,作,伴,好,还,乡','却,看,妻,子,愁,何,在,漫,卷,诗,书,喜,欲,狂','昼,出,耘,田,夜,绩,麻,村,庄,儿,女,各,当,家','童,孙,未,解,供,耕,织,也,傍,桑,阴,学,种,瓜','毕,竟,西,湖,六,月,中,风,光,不,与,四,时,同','千,里,黄,云,白,日,曛,北,风,吹,雁,雪,纷,纷','十,年,一,觉,扬,州,梦,赢,得,青,楼,薄,幸,名','路,人,借,问,遥,招,手,怕,得,鱼,惊,不,应,人','萧,萧,梧,叶,送,寒,声,江,上,秋,风,动,客,情','万,里,悲,秋,常,作,客,百,年,多,病,独,登,台','艰,难,苦,恨,繁,霜,鬓,潦,倒,新,停,浊,酒,杯','飞,来,山,上,千,寻,塔,闻,说,鸡,鸣,见,日,升','恸,哭,六,军,俱,缟,素,冲,冠,一,怒,为,红,颜']; 4 | var chooseArr=[ 5 | {'question':'“八百里分麾下灸，五十弦翻塞外声中”，“八百里”指的是？','answer':['八百公里','牛的代称','古代将领名'],'truec':1}, 6 | {'question':'“日照香炉生紫烟，遥看瀑布挂前川中”，“香炉”指的是?','answer':['香炉峰','祭拜焚香的鼎','香炉殿'],'truec':0}, 7 | {'question':'李白笔下“飞流直三千尺，疑银河落九天”指哪风景区?','answer':['华山','黄山','庐山'],'truec':2}, 8 | {'question':'“谁言寸草心，草报三春晖”表达思想情是？','answer':['友谊情深','母子情深','爱国之情'],'truec':1}, 9 | {'question':'“但使龙城飞将在，不教胡马度阴山”中的“龙城飞将”指的是？','answer':['汉朝名将霍去病','汉朝名将李广','赵国名将廉颇'],'truec':1}, 10 | {'question':'“春城无处不飞花，寒食东风御柳斜。” 寒食节即我国传统的？','answer':['春节','端午节','清明节'],'truec':2}, 11 | {'question':'以下哪一句是宋代诗人王安石《泊船瓜洲》中的名句？','answer':['春风又绿江南岸','春江水暖鸭先知','春风送暖入屠苏'],'truec':0}, 12 | {'question':'以下最能表达诗人和老朋友依依惜别的诗句是？','answer':['落花时节又逢君','劝君更尽一杯酒','青春作伴好还乡'],'truec':1}, 13 | {'question':'“天阶夜色凉如水，卧看牵牛织女星。”出自？','answer':['杜牧《秋夕》','白居易《忆江南》','杜甫《江南逢李龟年》'],'truec':0}, 14 | {'question':'刘禹锡的《酬乐天扬州初逢席上见赠》中，乐天指的是？','answer':['杜甫','白居易','李白'],'truec':1}, 15 | {'question':'李白笔下“杨花落尽子规啼，闻道龙标过五溪”中，子规指的是什么鸟？','answer':['画眉','喜鹊','杜鹃'],'truec':2}, 16 | {'question':'杜牧笔下“东风不与周郎便，铜雀春深锁二乔”中，铜雀台由何人所建？','answer':['曹操','曹丕','曹植'],'truec':0}, 17 | {'question':'杜甫的著名诗句“会当凌绝顶,一览众山小”形容的是？','answer':['安徽黄山','江西庐山','山东泰山'],'truec':2}, 18 | {'question':'“姑苏城外寒山寺,夜半钟声到客船”中的“寒山寺”位于？','answer':['山西省 ','浙江省','江苏省'],'truec':1}, 19 | {'question':'“何当共剪西窗烛，却话巴山夜雨时”中的“剪烛”目的是？','answer':['调暗烛光 ','调亮烛光','熄灭蜡烛'],'truec':1} 20 | ] 21 | -------------------------------------------------------------------------------- /jquery-demos/ancient-poetry1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 猜古诗 6 | 25 | 26 | 27 |
28 |
29 |
30 |

31 |

32 | 35 |
    36 | 37 |
38 |
39 | 40 |
41 |
42 | 43 |
44 |
45 | 46 | 47 | 48 | 49 | 245 | -------------------------------------------------------------------------------- /jquery-demos/ancient-poetry.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 猜古诗 6 | 25 | 26 | 27 |
28 |
29 |
30 |

31 |

32 | 35 |
    36 | 37 |
38 |
39 | 40 |
41 |
42 | 43 |
44 |
45 | 46 | 47 | 48 | 49 | 245 | -------------------------------------------------------------------------------- /html5-demos/downloadImg/downloadImg.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 下载图片 5 | 67 | 68 | 69 |
70 |
71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 85 | 86 | 87 | 88 | 92 | 93 | 94 | 95 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 116 | 117 |
画布尺寸
背景图片
用户名 83 | 84 |
用户名x坐标 89 |
90 |

居中显示

91 |
用户名y坐标 96 |
97 |

居中显示

98 |
用户名字体大小
文字颜色
图片类型 111 | 115 |
118 | 119 | 120 | 121 |
122 |
123 | 124 |
125 |
126 | 127 | 325 | -------------------------------------------------------------------------------- /html5-demos/bubble/main1.js: -------------------------------------------------------------------------------- 1 | var self = this 2 | var circleArr = [] 3 | var showCircleArr = [] 4 | $(document).ready(function() { 5 | var canvas = document.createElement('canvas'), 6 | canvasCircleArr 7 | canvas.id = 'canvas' 8 | canvas.width = self.window.innerWidth 9 | canvas.height = self.window.innerHeight / 2 10 | document.getElementById('drawCanvas').appendChild(canvas) 11 | canvasCircleArr = canvasCircleInit(canvas) 12 | $('#btn').click(function () { 13 | var ctx = canvas.getContext('2d') 14 | ctx.clearRect(0, 0, canvas.width, canvas.height) 15 | var value = $('#input').val() ? $('#input').val() : '' 16 | for(var i = 0; i < showCircleArr.length; i++) { 17 | var item = showCircleArr[i] 18 | var x = ~~ (Math.random() * canvas.width) 19 | var y = ~~ (Math.random() * canvas.height) 20 | option = { 21 | isClick : true, 22 | isWord: true, 23 | originRadius: ~~ (Math.random() * 3) + 1, 24 | radius: ~~ (Math.random() * 3) + 1, 25 | color: 'rgba(255, 255, 255, 0.5', 26 | } 27 | item.changeOption(option) 28 | circleArr.push(item) 29 | } 30 | showCircleArr = [] 31 | loadCanvas(value, canvas) 32 | }) 33 | // setTimeout(autoTime.bind(this, 10), 1500) //自动倒计时 34 | }) 35 | function autoTime(value) { 36 | if(value > -1) { 37 | var ctx = canvas.getContext('2d') 38 | ctx.clearRect(0, 0, canvas.width, canvas.height) 39 | for(var i = 0; i < showCircleArr.length; i++) { 40 | var item = showCircleArr[i] 41 | var x = ~~ (Math.random() * canvas.width) 42 | var y = ~~ (Math.random() * canvas.height) 43 | option = { 44 | isClick : true, 45 | isWord: true, 46 | originRadius: ~~ (Math.random() * 3) + 1, 47 | radius: ~~ (Math.random() * 3) + 1, 48 | color: 'rgba(255, 255, 255, 0.5', 49 | } 50 | item.changeOption(option) 51 | circleArr.push(item) 52 | } 53 | showCircleArr = [] 54 | loadCanvas(value, canvas) 55 | value -- 56 | setTimeout(autoTime.bind(this, value), 1500) 57 | } 58 | } 59 | function Bubble(option) { 60 | this.width = self.window.innerWidth 61 | this.height = self.window.innerHeight / 2 62 | this.originRadius = this.radius = option ? option.radius : 6 63 | this.color = option ? option.color : '#fff' 64 | this.lastX = this.x = option ? option.x : ~~ (Math.random() * this.width) //lastX，lastY为过渡变量，表示粒子从一个地点到下一个地点过渡时使用 65 | this.lastY = this.y = option ? option.y : ~~ (Math.random() * this.height / 2) 66 | this.randomX = ~~ (Math.random() * this.width) 67 | this.randomY = ~~ (Math.random() * this.height) 68 | this.speed = 4 69 | this.once = false 70 | this.isNew = false 71 | this.isWord = false 72 | } 73 | Bubble.prototype.changeOption = function(option) { 74 | this.originRadius = option.originRadius ? option.originRadius : this.radius 75 | this.lastRadius = this.radius 76 | this.radius = option.radius ? option.radius : 6 77 | this.color = option.color ? option.color : '#fff' 78 | this.x = option.x ? option.x : this.x 79 | this.y = option.y ? option.y : this.y 80 | this.lastY = option.lastY ? option.lastY : this.lastY 81 | this.lastX = option.lastX ? option.lastX : this.lastX 82 | this.isNew = option.isNew ? option.isNew : false 83 | this.isWord = option.isWord ? option.isWord : false 84 | this.isClick = option.isClick ? option.isClick : false 85 | } 86 | Bubble.prototype.draw = function(ctx, randomMove) { 87 | if(randomMove) { 88 | var dis = ~~ Math.sqrt(Math.pow(Math.abs(this.x - this.randomX), 2) + Math.pow(Math.abs(this.y - this.randomY), 2)), 89 | ease = 0.05 90 | if(this.isWord) { 91 | var disLastPosition = ~~ Math.sqrt(Math.pow(Math.abs(this.lastX - this.randomX), 2) + Math.pow(Math.abs(this.lastY - this.randomY), 2)) 92 | var ease = 0.05 93 | if (disLastPosition > 0) { 94 | if (this.lastX < this.randomX) { 95 | this.lastX += disLastPosition * ease 96 | } else { 97 | this.lastX -= disLastPosition * ease 98 | } 99 | if (this.lastY < this.randomY) { 100 | this.lastY += disLastPosition * ease 101 | } else { 102 | this.lastY -= disLastPosition * ease 103 | } 104 | } else { 105 | this.lastX = this.randomX 106 | this.lastY = this.randomY 107 | this.x = this.lastX //更新x,y值 108 | this.y = this.lastY 109 | this.isWord = false 110 | } 111 | ctx.beginPath() 112 | ctx.arc(this.lastX, this.lastY, this.originRadius, 0, 2 * Math.PI, false) 113 | ctx.fillStyle = 'rgba(255, 255, 255, 0.5)' 114 | ctx.fill() 115 | return 116 | } 117 | if( dis > 0) { 118 | if(this.x < this.randomX) { 119 | this.x += dis * ease 120 | } else { 121 | this.x -= dis * ease 122 | } 123 | if(this.y < this.randomY) { 124 | this.y += dis * ease 125 | } else { 126 | this.y -= dis * ease 127 | } 128 | } else { 129 | this.speed = 4 130 | this.randomX += ~~(Math.random() * (Math.random() > 0.5 ? 5 : -5) * 2) 131 | this.randomY += ~~(Math.random() * (Math.random() > 0.5 ? 5 : -5) * 2) 132 | } 133 | ctx.beginPath() 134 | ctx.arc(this.x, this.y, this.originRadius, 0, 2 * Math.PI, false) 135 | ctx.fillStyle = 'rgba(255, 255, 255, 0.5)' 136 | ctx.fill() 137 | 138 | } else { 139 | var x = this.x * 3 + 50, 140 | y = this.y * 3 + 50, 141 | dis = ~~ Math.sqrt(Math.pow(Math.abs(this.lastX - x), 2) + Math.pow(Math.abs(this.lastY - y), 2)) 142 | color = this.color || '#fff', 143 | ease = 0.05, 144 | maxRaduis = 10 145 | // if(this.disRadius !== null) { //半径范围变化 尚未完成 146 | // this.disRadius = ~~ Math.abs(this.lastRadius - maxRaduis) 147 | // if(this.disRadius > 0) { 148 | // if(this.lastRadius < maxRaduis) { 149 | // this.lastRadius += this.disRadius * ease 150 | // } else { 151 | // this.lastRadius -= this.disRadius * ease 152 | // } 153 | // ctx.fillStyle = 'rgba(255, 255, 255, 0.5)' 154 | // ctx.fill() 155 | // ctx.beginPath() 156 | // ctx.arc(this.x, this.y, this.lastRadius, 0, 2 * Math.PI, false) 157 | // return 158 | // } 159 | 160 | // } 161 | // this.disRadius = null 162 | if (dis > 0) { 163 | if (this.lastX < x) { 164 | this.lastX += dis * ease 165 | } else { 166 | this.lastX -= dis * ease 167 | } 168 | if (this.lastY < y) { 169 | this.lastY += dis * ease 170 | } else { 171 | this.lastY -= dis * ease 172 | } 173 | } else { 174 | this.lastX = x 175 | this.lastY = y 176 | } 177 | 178 | ctx.beginPath() 179 | ctx.arc(this.lastX, this.lastY, this.radius, 0, 2 * Math.PI, false) 180 | ctx.fillStyle = color || '#fff' 181 | ctx.fill() 182 | } 183 | } 184 | 185 | 186 | function canvasCircleInit(canvas) { 187 | var ctx = canvas.getContext('2d') 188 | var self = this 189 | for(var i = 0; i < 100; i++) { 190 | var option = { 191 | radius: ~~(Math.random() * 3) + 1, 192 | x: ~~ (Math.random() * self.window.innerWidth), 193 | y: ~~ (Math.random() * self.window.innerHeight / 2), 194 | color: 'rgba(255, 255, 255, 0.5' 195 | } 196 | var bubble = new Bubble(option) 197 | circleArr.push(bubble) 198 | } 199 | function randomMove(ctx) { 200 | ctx.clearRect(0, 0, canvas.width, canvas.height) 201 | circleArr.forEach(function (item, index) { 202 | item.draw(ctx, true) 203 | }) 204 | showCircleArr.forEach(function(item, index) { 205 | item.draw(ctx) 206 | }) 207 | setTimeout(randomMove.bind(self, ctx), 10) 208 | } 209 | setTimeout(randomMove.bind(self, ctx), 10) 210 | 211 | return circleArr 212 | } 213 | function loadCanvas(value, canvasBg) { 214 | var fontSize = 100, 215 | width = calWordWidth(value, fontSize), 216 | canvas = document.createElement('canvas') 217 | canvas.id = 'b_canvas' 218 | canvas.width = width 219 | canvas.height = fontSize 220 | var ctx = canvas.getContext('2d') 221 | ctx.font = fontSize + "px Microsoft YaHei" 222 | ctx.fillStyle = "orange" 223 | ctx.fillText(value, 0, fontSize / 5 * 4) //轻微调整绘制字符位置 224 | getImage(canvasBg, canvas, ctx) //导出为图片再导入到canvas获取图像数据 225 | } 226 | function getImage(canvasBg, canvas, ctx) { 227 | var image = new Image() 228 | image.src = canvas.toDataURL("image/jpeg") 229 | image.onload = function() { 230 | ctx.clearRect(0, 0, canvas.width, canvas.height) 231 | ctx.drawImage(image, 0, 0, this.width, this.height) 232 | var imageData = ctx.getImageData(0, 0, this.width, this.height) 233 | var dataLength = imageData.data.length 234 | var diff = 4 235 | var newCanvas = document.getElementById('canvas') 236 | var newCtx = newCanvas.getContext('2d') 237 | for (var j = 0; j < this.height; j += diff) { 238 | for (var i = 0; i < this.width; i += diff) { 239 | var colorNum = 0 240 | for (var k = 0; k < diff * diff; k++) { 241 | var row = k % diff 242 | var col = ~~(k / diff) 243 | let r = imageData.data[((j + col) * this.width + i + row) * 4 + 0] 244 | let g = imageData.data[((j + col) * this.width + i + row) * 4 + 1] 245 | let b = imageData.data[((j + col) * this.width + i + row) * 4 + 2] 246 | if (r < 10 && g < 10 && b < 10) colorNum++ 247 | } 248 | if (colorNum < diff * diff / 3 * 2) { 249 | var option = { 250 | x: i, 251 | y: j, 252 | radius: 6, 253 | color: '#fff', 254 | originRadius: ~~(Math.random() * 3) + 1 255 | } 256 | var bubble = circleArr.pop() 257 | if(!bubble) { //如果画布中的粒子数不够应继续添加，同时新的例子出现的位置应该是随机的 258 | option.isNew = true 259 | var newBubble = new Bubble(option) 260 | var newOption = { 261 | lastX: ~~ (Math.random() * canvasBg.width), 262 | lastY: ~~ (Math.random() * canvasBg.height), 263 | isNew: true 264 | } 265 | newBubble.changeOption(newOption) 266 | showCircleArr.push(newBubble) 267 | } else { 268 | bubble.changeOption(option) 269 | showCircleArr.push(bubble) 270 | } 271 | } 272 | } 273 | } 274 | // document.getElementById('body').appendChild(canvas) //离屏canvas展现到界面中看到渲染效果 275 | } 276 | } 277 | function calWordWidth(value, fontSize) { 278 | var arr = value.toString() ? value.toString().split('') : '' 279 | if(!arr) return 280 | var reg = /\w/, 281 | width = 0 282 | arr.forEach(function (item, index) { 283 | if (reg.test(item)) { 284 | width += fontSize //字母宽度 285 | } else { 286 | width += fontSize + 10 //汉字宽度 287 | } 288 | }) 289 | return width 290 | } 291 | -------------------------------------------------------------------------------- /html5-demos/bubble/bubble1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 11 | 12 | 13 | 14 | 15 | 295 | -------------------------------------------------------------------------------- /vue-demos/sudoku/sudoku.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | vue-所谓的数独 6 | 7 | 128 | 129 | 130 |
131 |
132 |

所谓的数独：规则

133 |

1.每一行数字不重复

134 |

2.每一列数字不重复

135 |
136 |
137 | 138 |
139 | 140 | 146 |
152 | {{allNumText[index][indexSub]}} 153 | 154 |
155 |
156 | 157 |
159 |
    160 |
  • 1
    • 161 |
  • 2
    • 162 |
  • 3
    • 163 |
  • 4
    • 164 |
  • 5
    • 165 |
  • 6
    • 166 |
  • 7
    • 167 |
  • 8
    • 168 |
  • 9
    • 169 |
170 |
171 |
172 |
173 | 174 | 175 | 383 | -------------------------------------------------------------------------------- /vue-demos/shopping-card/shopping-card.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 364 | 365 | 366 |
367 |

购物清单

368 |
369 |
全选
370 |
商品
371 |
数量
372 |
单价(元)
373 |
金额(元)
374 |
操作
375 |
376 |
377 | 378 | 379 | 380 | 381 | 382 | 391 | 398 | 401 | 404 | 405 | 406 | 407 |
383 |
384 |
{{item.pro_name}}
385 |

品牌：{{item.pro_brand}}  产地：{{item.pro_place}}

386 |

规格/纯度:{{item.pro_purity}}  起定量：{{item.pro_min}}

387 |

配送仓储：{{item.pro_depot}}

388 |
389 |
390 | 		392 |
393 | 394 | 395 | 396 |
397 | 		399 |

￥{{item.pro_price.toFixed(2)}}

400 | 		402 |

￥{{item.pro_price*item.pro_num}}.00

403 | 		删除
408 |
409 |
410 | 删除所选商品 411 | 继续购物 412 | 去结算 413 |

￥{{getTotal.totalPrice}}

414 |

{{getTotal.totalNum}}件商品总计（不含运费）：

415 |
416 |
417 | 418 | 419 | 506 | -------------------------------------------------------------------------------- /jquery-demos/js/mich1.1.js: -------------------------------------------------------------------------------- 1 | var myDom={ 2 | //去除空格 3 | trim:function(str){ 4 | return str.replace(/\s+/g,""); 5 | }, 6 | /* 7 | 1:首字母大写 8 | 2：首页母小写 9 | 3：大小写转换 10 | 4：全部大写 11 | 5：全部小写 12 | * */ 13 | changeCase:function(str,type) 14 | { 15 | switch(type){ 16 | case 1:return str.replace(/^(\w)(\w+)/,function (v,v1,v2){return v1.toUpperCase()+v2.toLowerCase();}); 17 | case 2:return str.replace(/^(\w)(\w+)/,function (v,v1,v2){return v1.toLowerCase()+v2.toUpperCase();}); 18 | case 3:return str.replace(/^([a-z]+)([A-Z]+)/,function (v,v1,v2){return v1.toUpperCase()+v2.toLowerCase();}); 19 | case 4:return str.toUpperCase(); 20 | case 5:return str.toLowerCase(); 21 | default:return str; 22 | } 23 | }, 24 | //字符串替换(字符串,要替换的字符,替换成什么) 25 | replaceAll:function (str,AFindText,ARepText){ 26 | 　　　raRegExp = new RegExp(AFindText,"g"); 27 | 　　　return str.replace(raRegExp,ARepText); 28 | }, 29 | //字符串倒序 30 | reverse:function(str){ 31 | return str.split("").reverse().join(""); 32 | }, 33 | //替换中间几位(电话) 34 | replacePhone:function (str){ 35 | return str.replace(/(\d{3})\d{5}(\d{3})/, '$1*****$2'); 36 | }, 37 | //检测字符串类型 38 | checkType:function(str,type){ 39 | switch(type){ 40 | case 'email':return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str); 41 | case 'phone':return /^1[3|4|5|7|8][0-9]{9}$/.test(str); 42 | case 'tel':return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str); 43 | case 'password':return /^[0-9a-zA-Z_\.-]{6,16}$/.test(str); 44 | case 'number':return /^[0-9]$/.test(str); 45 | case 'english':return /^[a-zA-Z]+$/.test(str); 46 | case 'lower':return /^[a-z]+$/.test(str); 47 | case 'upper':return /^[A-Z]+$/.test(str); 48 | case undefined:return true; 49 | case null:return true; 50 | case '':return true; 51 | default : return eval(type).test(str); 52 | } 53 | }, 54 | //数组去重 55 | removeReapt:function(array1){ 56 | var arr=[]; 57 | for(var i=0,len=array1.length;inum){ 100 | num=obj[o]; 101 | k1=o; 102 | } 103 | arr.push({ele:o,count:obj[o]}); 104 | } 105 | arr.sort(function(n1,n2){return n2.count-n1.count}); 106 | for (var i = 0,len=arr.length;i0?Math.ceil(speen):Math.floor(speen); 156 | if(attr=="opacity"){ 157 | obj.style.opacity=(setValue+speen)/100; 158 | obj.style.filter='alpha(opacity:)'+(setValue+speen)+')'; 159 | } 160 | else{ 161 | //匀速运动中,如果差距小于速度值,则让当前直接等于目标 162 | if(type&&typevValue2) { 325 | return 1; 326 | }else{ 327 | return 0; 328 | } 329 | } 330 | }; 331 | } 332 | // //吸顶盒 333 | // scrollTopBox:function(obj){ 334 | // var offectTop=obj["box"].offsetTop,scrollTop; 335 | // var isscroll=obj["winscroll"]||true; 336 | // function doscroll(){ 337 | // scrollTop=document.documentElement.scrollTop || document.body.scrollTop; 338 | // var top1=obj["top"]||0; 339 | // obj["box"].style.top=top1+"px"; 340 | // alert("asd") 341 | // if(offectTop0){ 450 | oEle1=objCreate.getElementsByClassName("vc-msgText")[0]; 451 | oEle1.innerHTML=_text; 452 | } 453 | else{ 454 | oEle1=this.createEle(ele); 455 | oEle1.innerHTML=_text; 456 | objCreate.appendChild(oEle1); 457 | } 458 | oEle1.style.display=""; 459 | }, 460 | //检查是否有类名 461 | objHasClass:function(obj,classStr){ 462 | var arr=obj.className.split(/\s+/); 463 | return (arr.indexOf(classStr)==-1)?false:true; 464 | }, 465 | //添加类名 466 | objAddClass:function(obj,classStr){ 467 | if(!this.objHasClass(obj,classStr)){ 468 | obj.className+=" "+classStr; 469 | } 470 | }, 471 | //删除类名 472 | objRemoveClass:function(obj,classStr){ 473 | if (this.objHasClass(obj,classStr)) { 474 | var reg = new RegExp('(\\s|^)' + classStr + '(\\s|$)'); 475 | obj.className = obj.className.replace(reg, ''); 476 | } 477 | }, 478 | //隐藏元素 479 | hideCreate:function(objHide){ 480 | if(objHide.getElementsByClassName("vc-msgText")[0]){ 481 | objHide.getElementsByClassName("vc-msgText")[0].style.display="none"; 482 | } 483 | }, 484 | //请求 485 | ajaxUrl:function(url,callBack){ 486 | var xmlhttp; 487 | if (window.XMLHttpRequest) 488 | { 489 | // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 490 | xmlhttp=new XMLHttpRequest(); 491 | } 492 | else 493 | { 494 | // IE6, IE5 浏览器执行代码 495 | xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 496 | } 497 | xmlhttp.onreadystatechange=function() 498 | { 499 | if (xmlhttp.readyState==4 && xmlhttp.status==200) 500 | { 501 | callBack(xmlhttp.responseText); 502 | } 503 | } 504 | xmlhttp.open("GET",url,true); 505 | xmlhttp.send(); 506 | }, 507 | //检验规则 508 | rules:function(value,rule){ 509 | if(value.length==0){return true;} 510 | switch(rule){ 511 | case 'email':return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(value); 512 | case 'phone':return /^1[3|4|5|7|8][0-9]{9}$/.test(value); 513 | case 'tel':return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(value); 514 | case 'pwd':return /^[0-9a-zA-Z_\.-]+$/.test(value); 515 | case 'pwd2':return value==this.oPassWord.value; 516 | case 'mpwd':return /^[0-9]{6}$/.test(value); 517 | case 'mpwd2':return value==this.omPassWord.value; 518 | case 'number':return /^[0-9]+$/.test(value); 519 | case 'english':return /^[a-zA-Z]+$/.test(value); 520 | case 'lower':return /^[a-z]+$/.test(value); 521 | case 'upper':return /^[A-Z]+$/.test(value); 522 | case 'date':return /^((\d{4})[\-|\.|\/](\d{1,2})[\-|\.|\/](\d{1,2}))?$/.test(value); 523 | case undefined:return true; 524 | case null:return true; 525 | case '':return true; 526 | default : return eval(rule).test(value); 527 | } 528 | }, 529 | //检验是否为空 530 | doError:function(type,ele,eleParent,minCount,maxCount){ 531 | var ruleTextMsg=""; 532 | if(type==='data-vc-null'){ruleTextMsg=ele.getAttribute(type)||"该处不能为空";} 533 | else if(type==='data-vc-msg'){ruleTextMsg=ele.getAttribute(type)||"请填写正确格式的信息";} 534 | else if(type==='data-vc-min'){ 535 | ruleTextMsg=ele.getAttribute("data-minMsg")||"此处需要选择"+minCount+"至"+maxCount+"项"; 536 | if(!maxCount){ruleTextMsg="此处至少需要选择"+minCount+"项";} 537 | } 538 | else if(type==='data-vc-max'){ 539 | ruleTextMsg=ele.getAttribute("data-maxMsg")||"此处需要选择"+minCount+"至"+maxCount+"项"; 540 | if(!minCount){ruleTextMsg="此处至多可以选择"+maxCount+"项";} 541 | } 542 | else{ruleTextMsg="该处不能为空";} 543 | this.checkCreate(eleParent,ruleTextMsg,this.errorEle); 544 | this.objAddClass(eleParent,'vc-error'); 545 | return false; 546 | }, 547 | doSussess:function(ele,classStr){ 548 | this.hideCreate(ele); 549 | this.objRemoveClass(ele,classStr); 550 | return true; 551 | }, 552 | //检验长度 553 | orlength:function(value,minlength,maxlength){ 554 | if(minlength&&value.lengthmaxlength){ 558 | return true; 559 | } 560 | }, 561 | //text检查 562 | ckeckDoText:function(objDo){ 563 | var inputVal=objDo.value,oLi=objDo.parentNode,ruleText; 564 | if(objDo.getAttribute("data-vc-rule")){ 565 | if(objDo.getAttribute("data-vc-rule")[0]=="/"&&objDo.getAttribute("data-vc-rule").substr(-1,1)=="/"){ 566 | ruleText=[objDo.getAttribute("data-vc-rule")]; 567 | } 568 | else{ 569 | ruleText=objDo.getAttribute("data-vc-rule").replace(/\[/g,",").replace(/\]/g,"").split(","); 570 | } 571 | } 572 | //如果为空 573 | if(objDo.getAttribute("data-vc-null")!=null&&inputVal.length==0){ 574 | return this.doError("data-vc-null",objDo,oLi); 575 | } 576 | //如果格式错误 577 | if(ruleText&&!this.rules(inputVal,ruleText[0])){ 578 | return this.doError("data-vc-msg",objDo,oLi); 579 | } 580 | //如果长度不合符 581 | if(inputVal.length>0&&ruleText&&ruleText.length>=2&&this.orlength(inputVal,ruleText[1],ruleText[2])){ 582 | var lengthMsg; 583 | lengthMsg="该处正确长度为"+ruleText[1]+"至"+ruleText[2]; 584 | if(!ruleText[1]){ 585 | lengthMsg="该处最大长度为"+ruleText[2]; 586 | } 587 | if(!ruleText[2]){ 588 | lengthMsg="该处最小长度为"+ruleText[1]; 589 | } 590 | if(ruleText[3]){ 591 | lengthMsg=ruleText[3]; 592 | } 593 | this.checkCreate(oLi,lengthMsg,this.errorEle); 594 | this.objAddClass(oLi,'vc-error'); 595 | return false; 596 | } 597 | //如果是检查密码 598 | if(ruleText&&ruleText[0]=="pwd"&&this.oPassWord2.value.length>0){ 599 | if(this.oPassWord2.value==objDo.value){ 600 | this.hideCreate(this.oPassWord2.parentNode); 601 | } 602 | else{ 603 | this.checkCreate(this.oPassWord2.parentNode,this.oPassWord2.getAttribute("data-vc-msg")||"两次密码不一致",this.errorEle); 604 | this.objAddClass(oLi,'vc-error'); 605 | return false; 606 | } 607 | } 608 | //如果是检查小密码 609 | if(ruleText&&ruleText[0]=="mpwd"&&this.omPassWord2.value.length>0){ 610 | if(this.omPassWord2.value==objDo.value){ 611 | this.hideCreate(this.omPassWord2.parentNode); 612 | } 613 | else{ 614 | this.checkCreate(this.omPassWord2.parentNode,this.omPassWord2.getAttribute("data-vc-msg")||"两次密码不一致",this.errorEle); 615 | this.objAddClass(oLi,'vc-error'); 616 | return false; 617 | } 618 | } 619 | //检查是否需要请求 620 | if(objDo.getAttribute("data-vc-url")){ 621 | var cf1=this,checkArr=objDo.getAttribute("data-vc-url").split(","); 622 | var urlMsg=checkArr[1]||"该用户名已注册了，请更换重试"; 623 | cf1.ajaxUrl(checkArr[0]+"?t="+new Date().getTime(),function(str){ 624 | if(str==objDo.value){ 625 | cf1.checkCreate(oLi,urlMsg,cf1.errorEle); 626 | cf1.objAddClass(oLi); 627 | return false; 628 | } 629 | }); 630 | } 631 | //如果没有错误 632 | return this.doSussess(oLi,'vc-error'); 633 | }, 634 | //checkBox检查 635 | ckeckDobox:function(objCheckBox){ 636 | var oLi=objCheckBox.parentNode,_checkBoxName=objCheckBox.name; 637 | var ocheckBox1=document.getElementsByName(_checkBoxName),checkConut=0; 638 | for(var i=0,len=ocheckBox1.length;icheckConut){ 646 | return this.doError("data-vc-min",objCheckBox,oLi,minCount,maxCount) 647 | } 648 | //如果最多需要选择几个 649 | if(maxCount&&maxCount