├── .idea ├── JS原生.iml ├── modules.xml ├── vcs.xml └── workspace.xml ├── README.md ├── css ├── black.css ├── common.css ├── green.css ├── index.css ├── red.css └── reset.css ├── html ├── firstFive.html ├── firstFour.html ├── firstOne.html ├── firstSix.html ├── firstThree.html ├── firstTwo.html ├── five1.html ├── five2.html ├── five3.html ├── five4.html ├── five5.html ├── five6.html ├── five7.html ├── five8.html ├── fourth1.html ├── fourth2.html ├── fourth3.html ├── fourth4.html ├── fourth5.html ├── fourth6.html ├── fourth7.html ├── fourth8.html ├── fourth9.html ├── secondEight.html ├── secondEleven.html ├── secondFive.html ├── secondFour.html ├── secondNine.html ├── secondOne.html ├── secondSeven.html ├── secondSix.html ├── secondTWL.html ├── secondTen.html ├── secondThree.html ├── secondTwo.html ├── six1.html ├── six2.html ├── six3.html ├── third5.html ├── third6.html ├── third7.html ├── third8.html ├── third9.html ├── thirdFour.html ├── thirdOne.html ├── thirdThree.html └── thirdTwo.html ├── image ├── 01.jpg ├── 02.jpg ├── 03.jpg ├── 04.jpg ├── 05.jpg ├── 1.jpg ├── 10.jpg ├── 2.jpg ├── 3.jpg ├── 4.jpg ├── 5.jpg ├── 6.jpg ├── 7.jpg ├── 8.jpg ├── 9.jpg ├── bg.jpg ├── big_1.jpg ├── big_10.jpg ├── big_11.jpg ├── big_2.jpg ├── big_3.jpg ├── big_4.jpg ├── big_5.jpg ├── big_6.jpg ├── big_7.jpg ├── big_8.jpg ├── big_9.jpg ├── btn-1.png ├── btn.png ├── ico.png ├── inputBg.jpg ├── loading.gif ├── nav_bg.png ├── search.jpg ├── shirt_1.jpg ├── shirt_1_big.jpg ├── shirt_2.jpg ├── shirt_2_big.jpg ├── shirt_3.jpg ├── shirt_3_big.jpg ├── shirt_4.jpg ├── shirt_4_big.jpg ├── small_1.jpg ├── small_10.jpg ├── small_11.jpg ├── small_2.jpg ├── small_3.jpg ├── small_4.jpg ├── small_5.jpg ├── small_6.jpg ├── small_7.jpg ├── small_8.jpg ├── small_9.jpg └── star.png ├── index.html └── js └── index.js /.idea/JS原生.iml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /.idea/modules.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /.idea/vcs.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /.idea/workspace.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 38 | 39 | 40 | 42 | 43 | 98 | 99 | 100 | 101 | 102 | false 103 | 104 | false 105 | false 106 | 107 | 108 | true 109 | DEFINITION_ORDER 110 | 111 | 112 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 143 | 144 | 147 | 148 | 149 | 150 | 153 | 154 | 157 | 158 | 161 | 162 | 163 | 164 | 165 | 166 | 167 | 168 | 169 | 170 | 171 | 172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | 181 | 182 | 192 | 193 | 194 | 195 | 196 | 197 | 198 | 199 | 200 | 201 | 202 | 203 | 204 | 205 | 206 | 207 | 208 | 209 | 210 | 211 | 212 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | 231 | 232 | project 233 | 234 | 235 | 236 | 237 | 238 | 239 | 240 | 241 | 242 | 243 | 244 | 245 | 246 | 247 | 248 | project 249 | 250 | 251 | true 252 | 253 | 254 | 255 | DIRECTORY 256 | 257 | false 258 | 259 | 260 | 261 | 262 | 264 | 265 | 266 | 267 | 268 | 269 | 270 | 1497582492969 271 | 295 | 296 | 297 | 298 | 300 | 301 | 302 | 303 | 304 | 305 | 306 | 307 | 308 | 309 | 310 | 311 | 312 | 313 | 314 | 315 | 316 | 317 | 318 | 319 | 320 | 321 | 322 | 323 | 324 | 325 | 326 | 327 | 328 | 329 | 330 | 331 | 332 | 333 | 334 | 335 | 336 | 337 | 338 | 339 | 340 | 341 | 342 | 343 | 344 | 345 | 347 | 348 | 350 | 351 | 352 | 353 | 354 | 355 | 356 | 357 | 358 | 359 | 360 | 361 | 362 | 363 | 364 | 365 | 366 | 367 | 368 | 369 | 370 | 371 | 372 | 373 | 374 | 375 | 376 | 377 | 378 | 379 | 380 | 381 | 382 | 383 | 384 | 385 | 386 | 387 | 388 | 389 | 390 | 391 | 392 | 393 | 394 | 395 | 396 | 397 | 398 | 399 | 400 | 401 | 402 | 403 | 404 | 405 | 406 | 407 | 408 | 409 | 410 | 411 | 412 | 413 | 414 | 415 | 416 | 417 | 418 | 419 | 420 | 421 | 422 | 423 | 424 | 425 | 426 | 427 | 428 | 429 | 430 | 431 | 432 | 433 | 434 | 435 | 436 | 437 | 438 | 439 | 440 | 441 | 442 | 443 | 444 | 445 | 446 | 447 | 448 | 449 | 450 | 451 | 452 | 453 | 454 | 455 | 456 | 457 | 458 | 459 | 460 | 461 | 462 | 463 | 464 | 465 | 466 | 467 | 468 | 469 | 470 | 471 | 472 | 473 | 474 | 475 | 476 | 477 | 478 | 479 | 480 | 481 | 482 | 483 | 484 | 485 | 486 | 487 | 488 | 489 | 490 | 491 | 492 | 493 | 494 | 495 | 496 | 497 | 498 | 499 | 500 | 501 | 502 | 503 | 504 | 505 | 506 | 507 | 508 | 509 | 510 | 511 | 512 | 513 | 514 | 515 | 516 | 517 | 518 | 519 | 520 | 521 | 522 | 523 | 524 | 525 | 526 | 527 | 528 | 529 | 530 | 531 | 532 | 533 | 534 | 535 | 536 | 537 | 538 | 539 | 540 | 541 | 542 | 543 | 544 | 545 | 546 | 547 | 548 | 549 | 550 | 551 | 552 | 553 | 554 | 555 | 556 | 557 | 558 | 559 | 560 | 561 | 562 | 563 | 564 | 565 | 566 | 567 | 568 | 569 | 570 | 571 | 572 | 573 | 574 | 575 | 576 | 577 | 578 | 579 | 580 | 581 | 582 | 583 | 584 | 585 | 586 | 587 | 588 | 589 | 590 | 591 | 592 | 593 | 594 | 595 | 596 | 597 | 598 | 599 | 600 | 601 | 602 | 603 | 604 | 605 | 606 | 607 | 608 | 609 | 610 | 611 | 612 | 613 | 614 | 615 | 616 | 617 | 618 | 619 | 620 | 621 | 622 | 623 | 624 | 625 | 626 | 627 | 628 | 629 | 630 | 631 | 632 | 633 | 634 | 635 | 636 | 637 | 638 | 639 | 640 | 641 | 642 | 643 | 644 | 645 | 646 | 647 | 648 | 649 | 650 | 651 | 652 | 653 | 654 | 655 | 656 | 657 | 658 | 659 | 660 | 661 | 662 | 663 | 664 | 665 | 666 | 667 | 668 | 669 | 670 | 671 | 672 | 673 | 674 | 675 | 676 | 677 | 678 | 679 | 680 | 681 | 682 | 683 | 684 | 685 | 686 | 687 | 688 | 689 | 690 | 691 | 692 | 693 | 694 | 695 | 696 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | > js的实例，有些很小仅仅是事件操作dom元素，有些很大如轮播图，防微博，等可以做成一个组件，有兴趣的可以纯当练手，在这里和大家分享一下，给个star0.0 2 | 3 | 4 | ## 演示 5 | 6 | 在线演示戳我 7 | ## 未完待续0.0 -------------------------------------------------------------------------------- /css/black.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background: #ccc; 3 | } 4 | .nav{ 5 | background: black; 6 | } -------------------------------------------------------------------------------- /css/common.css: -------------------------------------------------------------------------------- 1 | *{ margin: 0; 2 | padding: 0; 3 | } 4 | ul,li{ 5 | list-style: none; 6 | cursor: pointer; 7 | } 8 | a{ 9 | text-decoration: none; 10 | } 11 | a:link,a:visited{text-decoration:none;} 12 | a:hover{text-decoration: underline;} -------------------------------------------------------------------------------- /css/green.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background: #A3C5A8; 3 | } 4 | .nav{ 5 | background: green; 6 | } -------------------------------------------------------------------------------- /css/index.css: -------------------------------------------------------------------------------- 1 | 2 | .g-wrap{ 3 | width: 360px; 4 | height: auto; 5 | margin: 10px auto; 6 | border: 10px solid #eeeeee; 7 | padding: 5px; 8 | } 9 | .g-wrap .g-title{ 10 | font-size: 16px; 11 | font-weight: 700; 12 | text-align: center; 13 | background-color: #99cc00; 14 | color: white; 15 | margin: 5px; 16 | } 17 | .g-content .m-nav>li{ 18 | margin: 5px; 19 | } 20 | .m-nav .nav-title{ 21 | font-size: 14px; 22 | font-weight: 500; 23 | color: white; 24 | background-color: #99cc00; 25 | padding-left: 10px; 26 | } 27 | .m-nav .u-nav>li{ 28 | background-color: #77ccff; 29 | margin: 2px 0; 30 | font-size: 14px; 31 | padding-left: 10px; 32 | } 33 | .m-nav .u-nav>li>a{ 34 | color: white; 35 | } -------------------------------------------------------------------------------- /css/red.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background: #fdd; 3 | } 4 | .nav{ 5 | background: red; 6 | } -------------------------------------------------------------------------------- /css/reset.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) 3 | * http://cssreset.com 4 | */ 5 | html, body, div, span, applet, object, iframe, 6 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, 7 | a, abbr, acronym, address, big, cite, code, 8 | del, dfn, em, img, ins, kbd, q, s, samp, 9 | small, strike, strong, sub, sup, tt, var, 10 | b, u, i, center, 11 | dl, dt, dd, ol, ul, li, 12 | fieldset, form, label, legend, 13 | table, caption, tbody, tfoot, thead, tr, th, td, 14 | article, aside, canvas, details, embed, 15 | figure, figcaption, footer, header, 16 | menu, nav, output, ruby, section, summary, 17 | time, mark, audio, video, input { 18 | margin: 0; 19 | padding: 0; 20 | border: 0; 21 | font-size: 100%; 22 | font-weight: normal; 23 | vertical-align: baseline; 24 | } 25 | 26 | /* HTML5 display-role reset for older browsers */ 27 | article, aside, details, figcaption, figure, 28 | footer, header, menu, nav, section { 29 | display: block; 30 | } 31 | 32 | body { 33 | line-height: 1; 34 | } 35 | 36 | blockquote, q { 37 | quotes: none; 38 | } 39 | 40 | blockquote:before, blockquote:after, 41 | q:before, q:after { 42 | content: none; 43 | } 44 | 45 | table { 46 | border-collapse: collapse; 47 | border-spacing: 0; 48 | } 49 | 50 | /* custom */ 51 | a { 52 | color: #7e8c8d; 53 | text-decoration: none; 54 | -webkit-backface-visibility: hidden; 55 | } 56 | 57 | li { 58 | list-style: none; 59 | } 60 | 61 | ::-webkit-scrollbar { 62 | width: 5px; 63 | height: 5px; 64 | } 65 | 66 | ::-webkit-scrollbar-track-piece { 67 | background-color: rgba(0, 0, 0, 0.2); 68 | -webkit-border-radius: 6px; 69 | } 70 | 71 | ::-webkit-scrollbar-thumb:vertical { 72 | height: 5px; 73 | background-color: rgba(125, 125, 125, 0.7); 74 | -webkit-border-radius: 6px; 75 | } 76 | 77 | ::-webkit-scrollbar-thumb:horizontal { 78 | width: 5px; 79 | background-color: rgba(125, 125, 125, 0.7); 80 | -webkit-border-radius: 6px; 81 | } 82 | 83 | html, body { 84 | width: 100%; 85 | } 86 | 87 | body { 88 | -webkit-text-size-adjust: none; 89 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 90 | } -------------------------------------------------------------------------------- /html/firstFive.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 鼠标移入/移出改变样式 6 | 17 | 18 | 19 |

鼠标移入改变样式，鼠标移出恢复

20 | 33 | 34 | -------------------------------------------------------------------------------- /html/firstFour.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 用循环将三个Div变成红色 6 | 7 | 25 | 26 | 27 |

28 | 29 |

30 |

31 |

32 |

33 |

34 |

35 | 46 | 47 | -------------------------------------------------------------------------------- /html/firstOne.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 控制DIV属性 6 | 22 | 23 | 24 | 25 |

26 | 27 | 28 | 29 | 30 | 31 |

32 | 65 |

66 | 67 | -------------------------------------------------------------------------------- /html/firstSix.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 记住密码提示框 6 | 34 | 35 | 36 |

37 | 38 | 两周之内，自动登陆 39 | 40 |

41 | 为了您的信息安全，请不要在网吧或者公用网络使用此功能 42 |

43 |

44 | 56 | 57 | -------------------------------------------------------------------------------- /html/firstThree.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 函数接收参数并弹出 6 | 16 | 17 | 18 | 19 |

20 | 21 | 22 | 23 |

24 | 39 | 40 | -------------------------------------------------------------------------------- /html/firstTwo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 网页换肤 6 | 48 | 49 | 50 | 51 | 52 |

53 |

54 | 55 | 56 | 57 |

58 |

新闻
娱乐
体育
音乐
电影
旅游

66 |

67 | 91 | 92 | -------------------------------------------------------------------------------- /html/five1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 模拟select控件 6 | 7 | 80 | 81 | 82 |

83 |

84 | 88 |

89 |

地下城与勇士
魔兽世界（国服）
魔兽世界（台服）
热血江湖
神鬼传奇
大话西游II
QQ幻想世界

98 |

99 | 131 | 132 | -------------------------------------------------------------------------------- /html/five2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 点击页面，显示单击的坐标 6 | 7 | 8 | 15 | 16 | -------------------------------------------------------------------------------- /html/five3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 用户按下键盘，显示keyCode 6 | 7 | 14 | 15 | 16 |

这里将显示你按下的KeyCode

17 | 28 | 29 | -------------------------------------------------------------------------------- /html/five4.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 阻止右键菜单（阻止默认事件） 6 | 7 | 8 | 14 | 15 | -------------------------------------------------------------------------------- /html/five5.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 跟随鼠标移动（大图展示） 6 | 7 | 29 | 30 | 31 |

32 |

33 |

34 |

35 |

36 |

37 |

38 | 68 | 69 | -------------------------------------------------------------------------------- /html/five6.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 自定义右键菜单 6 | 7 | 44 | 45 | 46 |

剪切
复制
粘帖

51 | 74 | 75 | -------------------------------------------------------------------------------- /html/five7.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 用键盘控制Div 6 | 7 | 25 | 26 | 27 |

 28 | 红色方块为键盘操作区域，您可以进行如下操作：
 29 | 上：↑ 下：↓ 左：← 右：→
 30 | Ctrl + 1 : 背景变为绿色
 31 | Ctrl + 2 : 背景变为蓝色
 32 | Ctrl + 3 : 背景变为黑色
 33 | Ctrl + ↑ : 放大
 34 | Ctrl + ↓ : 缩小
 35 |

36 |

37 | 140 | 141 | -------------------------------------------------------------------------------- /html/five8.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Div闪烁 6 | 7 | 22 | 23 | 24 |

25 | 点击我闪烁 26 |

27 | 41 | 42 | -------------------------------------------------------------------------------- /html/fourth1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 二级导航栏 6 | 7 | 34 | 35 | 36 |

37 |

站长之家
40 | 行业资讯 41 |
42 | 43 |
44 | 45 | 业界动态| 46 | 收购融资| 47 | 门户动态| 48 | 搜索引擎| 49 | 网络游戏| 50 | 电子商务| 51 | 广告传媒| 52 | 厂商开发 53 | 54 |
55 |
56 |
58 | 站长在线 59 |
60 | 61 |
62 | 63 | 站长报道| 64 | 好站推荐| 65 | 站长聚会| 66 | 站长访谈| 67 | 站长茶馆| 68 | 网站排行 69 | 70 |
71 |
72 |
74 | 网站运营 75 |
76 | 77 |
78 | 79 | 建站经验| 80 | 策划盈利| 81 | 搜索优化| 82 | 网站推广| 83 | 免费资源 84 | 85 |
86 |
87 |
89 | 设计在线 90 |
91 | 92 |
93 | 94 | 酷站推荐| 95 | 网页设计| 96 | WEB标准| 97 | 视频处理| 98 | 设计活动 99 | 100 |
101 |
102 |
104 | 网络编程 105 |
106 | 107 |
108 | 109 | Asp编程| 110 | Php编程| 111 | .Net编程| 112 | Xml编程| 113 | Access| 114 | Mssql| 115 | Mysql 116 | 117 |
118 |
119 |
121 | 联盟资讯 122 |
123 | 124 |
125 | 126 | 联盟动态| 127 | 联盟介绍| 128 | 联盟点评| 129 | 网赚技巧 130 | 131 |
132 |
133 |
135 | 服务器 136 |
137 | 138 |
139 | 140 | Web服务器| 141 | Ftp服务器| 142 | Mail服务器| 143 | Dns服务器| 144 | Win服务器| 145 | Linux服务器| 146 | 安全防护| 147 | 虚拟主机 148 | 149 |
150 |
151 |

153 |

154 | 163 | 164 | -------------------------------------------------------------------------------- /html/fourth2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 自动播放一幻灯片效果 6 | 7 | 54 | 55 | 56 |

57 |

58 |

59 |

60 |

61 |

62 |

63 |

64 | 65 | 66 | 67 | 68 | 69 |

70 |

71 |

72 | 125 | 126 | -------------------------------------------------------------------------------- /html/fourth3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 自动播放一幻灯片效果 6 | 7 | 54 | 55 | 56 |

57 |

58 |

59 |

60 |

61 |

62 |

63 |

64 | 65 | 66 | 67 | 68 | 69 |

70 |

71 |

72 | 126 | 127 | -------------------------------------------------------------------------------- /html/fourth4.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | agruments应用一求出函数参数的总合 6 | 7 | 8 |

 9 | <script type="text/javascript">
10 |     var iResult = 0
11 |     function sum()
12 |     {
13 |         for (var i = 0; i < arguments.length; i++)
14 |         {
15 |             iResult += arguments[i]
16 |         }
17 |         return iResult
18 |     }
19 |     //应用
20 |     alert(sum(1,2,3,4,5,6,7,8,9,10)) //输出55
21 | </script>
22 |

23 | 35 | 36 | -------------------------------------------------------------------------------- /html/fourth5.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | css函数一设置/读取对象的属性 6 | 24 | 25 | 26 | 27 |

28 | 29 | 30 | 31 |

32 | 44 | 45 | -------------------------------------------------------------------------------- /html/fourth6.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 当前输入框高亮显示 6 | 7 | 32 | 33 | 34 |

35 |

用户登陆

36 | 37 | 用户名: 38 | 39 | 40 | 41 | 密码: 42 | 43 | 44 | 45 |

46 | 59 | 60 | -------------------------------------------------------------------------------- /html/fourth7.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 数组练习：各种数组方法的使用 6 | 7 | 18 | 19 | 20 |

January(1),February(2),March(3),April(4),May(5),June(6),July(7),Aguest(8),September(9),October(10),November(11),December(12)

21 | 22 | 23 |

0,1,2,3,4,5,6,7,8,9

24 | 25 | 26 |

 27 |     red,green,blue,white,yellow,black,brown
 28 |

29 | 30 | 31 | 32 | 33 | 34 | 100 | 101 | -------------------------------------------------------------------------------- /html/fourth8.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 事件练习：封装兼容性添加、删除事件的函数 6 | 7 | 14 | 15 | 16 |

17 | 18 | 19 | 20 |

21 | 37 | 38 | -------------------------------------------------------------------------------- /html/fourth9.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 星级评分系统 6 | 7 | 31 | 32 | 33 |

34 | 点击星星就能打分 35 |

37 | 38 | 39 | 40 |
42 | 43 | 44 | 45 |
47 | 48 | 49 | 50 |
52 | 53 | 54 | 55 |
57 | 58 | 59 | 60 |

62 |

63 |

64 | 110 | 111 | -------------------------------------------------------------------------------- /html/secondEight.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 简易JS年历 6 | 7 | 49 | 50 | 51 |

52 |

1
JAN
2
FER
3
MAR
4
APR
5
MAY
6
JUN
7
JUL
8
AUG
9
SEP
10
OCT
11
NOV
12
DEC

66 |

67 |

68 | 6月节日 69 |

70 |

端午节：6月4日至6日放假3天。

71 |

72 |

73 | 106 | 107 | -------------------------------------------------------------------------------- /html/secondEleven.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 鼠标移过，修改图片路径 6 | 7 | 44 | 45 | 46 |

47 |

61 |

62 | 80 | 81 | -------------------------------------------------------------------------------- /html/secondFive.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 函数传参，改变Div任意属性的值 6 | 7 | 32 | 33 | 34 |

35 | 36 | 属性名： 37 | 38 | 39 | 40 | 属性值： 41 | 42 | 43 | 44 | 45 |

在上方输入“属性名”和“属性值”，点击确认按钮查看效果。

46 |

47 | 64 | 65 | -------------------------------------------------------------------------------- /html/secondFour.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 弹出层效果 6 | 7 | 8 | 55 | 56 | 57 |

58 | 59 |

60 |

61 |

62 |

63 | 64 |

65 |

66 | 81 | 82 | -------------------------------------------------------------------------------- /html/secondNine.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 单一按钮显示/隐藏一播放列表收缩展开 6 | 7 | 8 | 41 | 42 | 43 |

44 |

播放列表

45 | 53 |

54 | 74 | 75 | -------------------------------------------------------------------------------- /html/secondOne.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 百度输入法 6 | 7 | 25 | 26 | 27 |

28 | 29 | 34 |

35 | 52 | 53 | -------------------------------------------------------------------------------- /html/secondSeven.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 简易选项卡 6 | 7 | 35 | 36 | 37 |

38 |

第一课
第二课
第三课

43 |

网页特效原理分析
响应用户操作
提示框效果
事件驱动
元素属性操作
动手编写第一个JS特效
引入函数
网页换肤效果
展开/收缩播放列表效果

54 | 69 | 84 |

85 | 104 | 105 | -------------------------------------------------------------------------------- /html/secondSix.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 图片列表：鼠标移入/移出改变图片透明度 6 | 7 | 24 | 25 | 26 |

27 |

28 |

29 |

30 |

31 |

32 |

33 |

34 |

35 |

36 |

37 |

38 | 51 | 52 | -------------------------------------------------------------------------------- /html/secondTWL.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 复选框（checkbox）全选/全不选/返选 6 | 7 | 47 | 48 | 49 | 90 | 131 | 132 | -------------------------------------------------------------------------------- /html/secondTen.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 提示框效果 6 | 7 | 49 | 50 | 51 |

52 |

名车车标展示-鼠标移过显示车标

53 |

55 | BMW
马汽车 56 | 57 |
59 | Alfa Romeo
阿尔法-罗米欧 60 | 61 |
63 | Skoda
斯柯达 64 | 65 |
67 | Volkswagen
大众汽车 68 | 69 |
71 | Saab
萨布牌轿车 72 | 73 |
75 | Lamborghini
兰博基尼 76 | 77 |
79 | Porsche
保时捷 80 | 81 |
83 | Peugeot
标致 84 | 85 |
87 | Mercedes1
梅赛德斯奔驰 88 | 89 |
91 | Buick
别克汽车 92 | 93 |

95 |

96 | 111 | 112 | -------------------------------------------------------------------------------- /html/secondThree.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 求出数组中所有数字的和 6 | 7 | 42 | 43 | 44 |

45 | 46 | 47 | 输入数字求和，数字之间用空格隔开 48 | 49 | 50 |

51 |

52 | 69 | 70 | -------------------------------------------------------------------------------- /html/secondTwo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 点击Div，显示其innerHTML 6 | 7 | 21 | 22 | 23 |

24 |

新华网北京5月29日电(新华社记者)从三聚氰胺到瘦肉精，从染色馒头到毒豆芽，在食品中添加非食用物质和滥用食品添加剂已成为百姓餐桌上突出的"不安全因素"。近期以来，从北京到广东，从浙江到宁夏，一场打击食品非法添加的"风暴"席卷全国。

25 |

4月21日，国务院部署严厉打击食品非法添加和滥用食品添加剂专项行动后，广东省高度重视，随即召开了全省电视电话会议。省委领导强调，食品安全是"高压线"，决不能"下不为例"；抓好食品安全要突出一个"严"字，做到严防、严查、严处。

26 |

宁夏重点开展了四轮问题乳粉彻查清缴工作，对全区养殖源头、鲜奶收购和乳制品生产、经营、餐饮等环节的2.7万家单位进行了全面清查，共查处问题乳粉案件4起、涉案企业3家，吊销2家乳粉生产企业生产许可证。

27 |

做好风险监测工作是许多地方加强食品安全的重点工作之一。在北京，全市设立了3000个风险监测点，建立了包括3000余种食品添加剂和非法添加物的数据库，对110家国内外食品相关组织、媒体发布的线索进行监测，及时进行风险评估，加强抽检控制。

28 |

29 | 40 | 41 | -------------------------------------------------------------------------------- /html/six1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 1) 完美拖拽 6 | 7 | 35 | 36 | 37 |

38 |

点击可回放拖拽轨迹

39 |

Drag:false
offsetTop:
offsetLeft:

44 |

45 | 100 | 101 | -------------------------------------------------------------------------------- /html/six2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /html/six3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Title 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /html/third5.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 页面加载后累加，自加1 6 | 7 | 14 | 15 | 16 |

17 | 0 18 |

19 | 30 | 31 | -------------------------------------------------------------------------------- /html/third6.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 判断数字是否为几位数 6 | 7 | 14 | 15 | 16 |

17 | 18 | 19 | 20 | 21 |

22 | 39 | 40 | -------------------------------------------------------------------------------- /html/third7.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 网页计算器 6 | 7 | 67 | 68 | 69 |

70 |

71 |

72 |

73 |

74 |

75 |

76 |

77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 |

96 |

97 |

98 | 158 | 159 | -------------------------------------------------------------------------------- /html/third8.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 简易网页时钟 6 | 7 | 26 | 27 | 28 |

29 | 30 | 31 | 32 | 点 33 | 34 | 35 | 36 | 分 37 | 38 | 39 | 40 | 秒 41 |

42 | 60 | 61 | -------------------------------------------------------------------------------- /html/third9.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 简易倒计时时钟 6 | 7 | 39 | 40 | 41 |

42 | 43 | 输入计时时间： 44 | 45 | 46 | 47 | 48 | 分 49 | 50 | 51 | 52 | 秒 53 | 54 | 55 |

56 | 78 | 79 | -------------------------------------------------------------------------------- /html/thirdFour.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 输入两个数字，比较大小 6 | 7 | 13 | 14 | 15 |

16 | 17 | 18 | 19 | vs 20 | 21 | 22 | 23 | 24 |

25 | 39 | 40 | -------------------------------------------------------------------------------- /html/thirdOne.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 用typeof查看数据类型 6 | 7 | 8 | 13 | 14 | -------------------------------------------------------------------------------- /html/thirdThree.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 累加按钮，自加1 6 | 7 | 17 | 18 | 19 |

20 | 21 |

22 | 30 | 31 | -------------------------------------------------------------------------------- /html/thirdTwo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 用parseInt解析数字，并求和 6 | 7 | 13 | 14 | 15 |

16 | 17 | 18 | 19 | + 20 | 21 | 22 | 23 | = 24 | ? 25 | 26 |

27 | 45 | 46 | -------------------------------------------------------------------------------- /image/01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/01.jpg -------------------------------------------------------------------------------- /image/02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/02.jpg -------------------------------------------------------------------------------- /image/03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/03.jpg -------------------------------------------------------------------------------- /image/04.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/04.jpg -------------------------------------------------------------------------------- /image/05.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/05.jpg -------------------------------------------------------------------------------- /image/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/1.jpg -------------------------------------------------------------------------------- /image/10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/10.jpg -------------------------------------------------------------------------------- /image/2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/2.jpg -------------------------------------------------------------------------------- /image/3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/3.jpg -------------------------------------------------------------------------------- /image/4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/4.jpg -------------------------------------------------------------------------------- /image/5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/5.jpg -------------------------------------------------------------------------------- /image/6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/6.jpg -------------------------------------------------------------------------------- /image/7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/7.jpg -------------------------------------------------------------------------------- /image/8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/8.jpg -------------------------------------------------------------------------------- /image/9.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/9.jpg -------------------------------------------------------------------------------- /image/bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/bg.jpg -------------------------------------------------------------------------------- /image/big_1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_1.jpg -------------------------------------------------------------------------------- /image/big_10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_10.jpg -------------------------------------------------------------------------------- /image/big_11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_11.jpg -------------------------------------------------------------------------------- /image/big_2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_2.jpg -------------------------------------------------------------------------------- /image/big_3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_3.jpg -------------------------------------------------------------------------------- /image/big_4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_4.jpg -------------------------------------------------------------------------------- /image/big_5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_5.jpg -------------------------------------------------------------------------------- /image/big_6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_6.jpg -------------------------------------------------------------------------------- /image/big_7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_7.jpg -------------------------------------------------------------------------------- /image/big_8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_8.jpg -------------------------------------------------------------------------------- /image/big_9.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/big_9.jpg -------------------------------------------------------------------------------- /image/btn-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/btn-1.png -------------------------------------------------------------------------------- /image/btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/btn.png -------------------------------------------------------------------------------- /image/ico.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/ico.png -------------------------------------------------------------------------------- /image/inputBg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/inputBg.jpg -------------------------------------------------------------------------------- /image/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/loading.gif -------------------------------------------------------------------------------- /image/nav_bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/nav_bg.png -------------------------------------------------------------------------------- /image/search.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/search.jpg -------------------------------------------------------------------------------- /image/shirt_1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/shirt_1.jpg -------------------------------------------------------------------------------- /image/shirt_1_big.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/shirt_1_big.jpg -------------------------------------------------------------------------------- /image/shirt_2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/shirt_2.jpg -------------------------------------------------------------------------------- /image/shirt_2_big.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/shirt_2_big.jpg -------------------------------------------------------------------------------- /image/shirt_3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/shirt_3.jpg -------------------------------------------------------------------------------- /image/shirt_3_big.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/shirt_3_big.jpg -------------------------------------------------------------------------------- /image/shirt_4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/shirt_4.jpg -------------------------------------------------------------------------------- /image/shirt_4_big.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/shirt_4_big.jpg -------------------------------------------------------------------------------- /image/small_1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_1.jpg -------------------------------------------------------------------------------- /image/small_10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_10.jpg -------------------------------------------------------------------------------- /image/small_11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_11.jpg -------------------------------------------------------------------------------- /image/small_2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_2.jpg -------------------------------------------------------------------------------- /image/small_3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_3.jpg -------------------------------------------------------------------------------- /image/small_4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_4.jpg -------------------------------------------------------------------------------- /image/small_5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_5.jpg -------------------------------------------------------------------------------- /image/small_6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_6.jpg -------------------------------------------------------------------------------- /image/small_7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_7.jpg -------------------------------------------------------------------------------- /image/small_8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_8.jpg -------------------------------------------------------------------------------- /image/small_9.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/small_9.jpg -------------------------------------------------------------------------------- /image/star.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laihuamin/jsExample/d840cefa5eaa6b914ae40d2feb23f68577f45e22/image/star.png -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | index 6 | 7 | 8 | 9 | 10 |

11 |

JS原生实例学习

12 |

13 |

15 |
第一课（6）
16 |
- 1)控制DIV属性
- 2)网页换肤
- 3)函数接收参数并弹出
- 4)用循环将三个Div变成红色
- 5)鼠标移入/移出改变样式
- 6)记住密码框
24 |
26 |
第二课
27 |
- 1) 百度输入法
- 2) 点击Div，显示其innerHTML
- 3) 求出数组中所有数字的和
- 4) 弹出层效果
- 5) 函数传参，改变Div任意属性的值
- 6) 图片列表：鼠标移入/移出改变图片透明度
- 7) 简易选项卡
- 8) 简易JS年历
- 9) 单一按钮显示/隐藏一播放列表收缩展开
- 10) 提示框效果
- 11) 鼠标移过，修改图片路径
- 12) 复选框（checkbox）全选/全不选/返选
41 |
43 |
第三课
44 |
- 1) 用typeof查看数据类型
- 2) 用parseInt解析数字，并求和
- 3) 累加按钮，自加1
- 4) 输入两个数字，比较大小
- 5) 页面加载后累加，自加1
- 6) 判断数字是否为几位数
- 7) 网页计算器
- 8) 简易网页时钟
- 9) 倒计时时钟（100秒）
55 |
57 |
第四课
58 |
69 |
71 |
第五课
72 |
- 1) 模拟select控件
- 2) 点击页面，显示单击的坐标
- 3) 用户按下键盘，显示keyCode
- 4) 阻止右键菜单（阻止默认事件）
- 5) 跟随鼠标移动（大图展示）
- 6) 自定义右键菜单
- 7) 用键盘控制Div
- 8) Div闪烁
82 |
84 |
第六课
85 |
- 1) 完美拖拽
- 2) 仿腾讯微博效果
- 3) 自定义多级右键菜单
90 |
92 |
第七课
93 |
98 |
100 |
第八课
101 |
107 |
109 |
第九课
110 |
115 |
117 |
第十课
118 |
134 |
136 |
项目实例
137 |
143 |
145 |
YUI实例
146 |
150 |
152 |
KISSY实例
153 |
161 |

163 |

164 |

165 | 166 | 167 | -------------------------------------------------------------------------------- /js/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by Administrator on 2017/6/16. 3 | */ 4 | --------------------------------------------------------------------------------