PageRenderTime 47ms CodeModel.GetById 24ms RepoModel.GetById 0ms app.codeStats 0ms

/gallery/form/1.1/demo.html

https://github.com/akecn/kissy-gallery
HTML | 144 lines | 128 code | 16 blank | 0 comment | 0 complexity | 48a8ea2b0aa11f21f8b234c47f9ed9a3 MD5 | raw file
    

  1. <!doctype html>
    2. 

  2. <html>
    3. 

  3. <head>
    4. 

  4. <meta charset="utf-8"/>
    5. 

  5. <title>KISSY.gallery.form</title>
    6. 

  6. 

  7. <link rel="stylesheet" href="http://a.tbcdn.cn/s/kissy/1.3.0/css/dpl/base-min.css"/>
    8. 

  8. <link rel="stylesheet" href="../../../tools/skin/default.css"/>
    9. 

  9. <script src="http://a.tbcdn.cn/s/kissy/1.2.0/kissy.js" charset="utf-8"></script>
    10. 

  10. <style>
    11. 

  11.     h1, h4 {
    12. 

  12.         font-family: 'MicroSoft YaHei';
    13. 

  13.         padding: 10px;
    14. 

  14.         margin: 10px 0;
    15. 

  15.     }
    16. 

  16. 

  17.     h1 {
    18. 

  18.         font-size: 36px;
    19. 

  19.         padding-bottom: 10px;
    20. 

  20.         border-bottom: 1px solid #ccc;
    21. 

  21.     }
    22. 

  22. 

  23.     h4 {
    24. 

  24.         font-size: 24px;
    25. 

  25.         padding: 0 10px;
    26. 

  26.         margin: 0 0 10px;
    27. 

  27.     }
    28. 

  28. 

  29.     h5 {
    30. 

  30.         font-size: 14px;
    31. 

  31.         font-weight: bold;
    32. 

  32.     }
    33. 

  33. 

  34.     button {
    35. 

  35.         padding: 5px 10px;
    36. 

  36.         margin-top: 10px;
    37. 

  37.     }
    38. 

  38. 

  39.     select {
    40. 

  40.         padding: 2px;
    41. 

  41.     }
    42. 

  42. 

  43.     .section {
    44. 

  44.         border: 1px solid #efefef;
    45. 

  45.         padding: 10px;
    46. 

  46.         margin: 30px 0;
    47. 

  47.         border-radius: 5px;
    48. 

  48.     }
    49. 

  49. 

  50.     h4 {
    51. 

  51.         padding-bottom: 5px;
    52. 

  52.         border-bottom: 1px solid #ccc;
    53. 

  53.     }
    54. 

  54. 

  55.     #gj p, #guard {
    56. 

  56.         padding: 10px 0;
    57. 

  57.         font-size: 24px;
    58. 

  58.         font-weight: bold;
    59. 

  59.         font-family: '楷体';
    60. 

  60.         color: #c00;
    61. 

  61.     }
    62. 

  62. 

  63.     .g {
    64. 

  64.         display: none;
    65. 

  65.     }
    66. 

  66. 

  67. </style>
    68. 

  68. <script src="http://a.tbcdn.cn/s/kissy/1.3.0/kissy.js" charset="utf-8"></script>
    69. 

  69.     <link rel="stylesheet" href="../../../tools/skin/show-code.js"/>
    70. 

  70. <link rel="stylesheet" href="assets/scroll.css"/>
    71. 

  71. <link rel="stylesheet" href="assets/clear.css"/>
    72. 

  72. <link rel="stylesheet" href="assets/chrome.css"/>
    73. 

  73. 

  74. 

  75. </head>
    76. 

  76. <body>
    77. 

  77. <div id="header">
    78. 

  78.     <h1 class="logo"><a alt="KISSY" href="http://kissyui.com/"><img src="http://a.tbcdn.cn/s/kissy/logo.png"/></a></h1>
    79. 

  79.     <div class="sub-title">Gallery</div>
    80. 

  80.     <ul class="navigation">
    81. 

  81.         <li><a href="http://docs.kissyui.com/">首页</a></li>
    82. 

  82.         <li><a href="http://github.com/kissyteam">源码</a></li>
    83. 

  83.     </ul>
    84. 

  84. 

  85. </div>
    86. 

  86. <div id="content">
    87. 

  87.     <div class="s-crumbs">
    88. 

  88.         <span>当前位置：</span>
    89. 

  89.         <a href="http://kissyui.com/">KISSY</a>
    90. 

  90.         <a href="../../../index.html">Gallery</a>
    91. 

  91.         <span>form</span>
    92. 

  92.     </div>
    93. 

  93.     <pre class="s-section">
    94. 

  94.         作者：明河（剑平）、紫英、张挺、牧云、易敛、飞绿、伯方
    95. 

  95.         功能：表单组件合集，目前包含uploader（异步文件上传）
    96. 

  96.         版本：V1.1.3
    97. 

  97.     </pre>
    98. 

  98.     <h3 class="s-title">Uploader：异步文件上传组件</h3>
    99. 

  99.     <p>作者：明河（剑平）、紫英、飞绿</p>
    100. 

  100.     <p>（V1.0弃用）</p>
    101. 

  101.     <p>demo：<a href="http://www.36ria.com/demo/gal/gallery/form/1.1/demo/form/uploader/index.html" target="_blank">
    102. 

  102.         
    103. 

  103.         V1.1demo</a>（V1.0弃用）</p>
    104. 

  104. 

  105.     <p>文档：<a href="http://www.36ria.com/demo/gal/gallery/form/1.1/doc/index.html" target="_blank">V1.1文档</a></p>
    106. 

  106.     <p>
    107. 

  107.         <img src="http://www.36ria.com/demo/gal/demo/form/uploader/assets/demo-1.png" alt="demo">
    108. 

  108.     </p>
    109. 

  109.     <h3 class="s-title">Checkbox：模拟多选框</h3>
    110. 

  110.     <p>作者：伯方</p>
    111. 

  111.     <div class="demo-wrapper">
    112. 

  112.         <form action="">
    113. 

  113.             <ul id="J_Content">
    114. 

  114.                 <li><input type="checkbox" name="ch-1" value="ch1">1 1 1 1</li>
    115. 

  115.                 <li><input type="checkbox" name="ch-2" value="ch2">2 2 2 2</li>
    116. 

  116.                 <li><input disabled="disabled" type="checkbox" name="ch-3" value="ch3">3 3 3 3</li>
    117. 

  117.                 <li><input disabled="disabled" type="checkbox" name="ch-4" value="ch4">4 4 4 4</li>
    118. 

  118.                 <li><input type="checkbox" name="ch-5" value="ch5">5 5 5 5</li>
    119. 

  119.                 <li><input type="checkbox" name="ch-6" value="ch6">6 6 6 6</li>
    120. 

  120.                 <li><input type="checkbox" name="ch-7" value="ch7">7 7 7 7</li>
    121. 

  121.                 <li><input type="checkbox" checked="checked" name="ch-8" value="ch8">8 8 8 8</li>
    122. 

  122.                 <li><input type="checkbox"  checked="checked" name="ch-9" value="ch9">9 9 9 9</li>
    123. 

  123.             </ul>
    124. 

  124.         </form>
    125. 

  125.     </div>
    126. 

  126. </div>
    127. 

  127. <div id="footer">
    128. 

  128.     &copy; Copyright 2010~2100, KISSY Team.
    129. 

  129. </div>
    130. 

  130. <script type="text/javascript">
    131. 

  131.     KISSY.config({
    132. 

  132.         packages:[ {
    133. 

  133.             name:"gallery",
    134. 

  134.             path:"../../../",
    135. 

  135.             charset:"utf-8"
    136. 

  136.         } ]
    137. 

  137.     });
    138. 

  138.     KISSY.use('gallery/form/1.1/checkbox/index,node', function (S, Checkbox,Node) {
    139. 

  139.         var r = new Checkbox('#J_Content input');
    140. 

  140.         r.render();
    141. 

  141.     })
    142. 

  142. </script>
    143. 

  143. </body>
    144. 

  144. </html>
    145.