index_pc.htm 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. <#def htmlOverflowHidden = true/>
  2. ${zhiqim_com_header()}
  3. ${zhiqim_com_topnav("index")}
  4. ${Styles.htmlOverflowHidden()}
  5. ${Scripts.src("/src_extend/zhiqim_scroll_screen.js")}
  6. ${Scripts.src("/src_extend/zhiqim_webgl_three.js")}
  7. <script>
  8. Z.onload(function()
  9. {
  10. //1、初始化滚屏,上方固定55px
  11. var sScreen = new Z.ScrollScreen();
  12. sScreen.fixHeight = 55;
  13. sScreen.speed = 19;
  14. sScreen.execute();
  15. //2、初始化动画
  16. var three = new Z.WebGLThree();
  17. three.threePath = "/zinc/www/three.js";
  18. three.target = "z-webgl-canvas";
  19. three.execute();
  20. //3、滚动监听
  21. Z(document).on("scroll",function(){
  22. var docScroll = document.documentElement.scrollTop;
  23. var itemHeight = parseFloat(Z(".section").css("height"));
  24. var num = Math.floor(docScroll / itemHeight);
  25. Z(Z(".section")[num]).addClass("fadeInDown").siblings(".section").removeClass("fadeInDown");
  26. })
  27. //4、调用数量累加
  28. countNum('programmersNum', 11000);
  29. countNum('companiesNum', 2600);
  30. });
  31. // 数量累加方法
  32. function countNum(elem, stop){
  33. var $elem = Z.$elem(elem, 'countNum');
  34. stop = parseFloat('0' + stop);
  35. if (stop === 0) {
  36. return Z.alert('countNum 方法参数设置有误!');
  37. }
  38. var start = 0;
  39. var sumNum = stop - start; // 总变化数值
  40. var duration = 2000; // 持续时间
  41. // 按 1s 30 帧,计算每一帧需要显示的数字
  42. var stepTime = 1000/30; // 每帧时间
  43. var stepNum = sumNum / (duration / stepTime); // 每帧变化数值
  44. var showNum = start;
  45. var setTime = setInterval(function() // 定义定时器
  46. {
  47. showNum += stepNum;
  48. showNum = Math.round(showNum);
  49. if (showNum >= stop) {
  50. showNum = stop;
  51. clearInterval(setTime);
  52. }
  53. $elem.html(showNum);
  54. },stepTime);
  55. }
  56. </script>
  57. <!--框架体系-->
  58. <div data-role="z-screen" class="section" id="first" style="background-color:#1d72c0;">
  59. <div id="z-webgl-canvas" class="z-absolute z-w100p z-h100p"></div>
  60. <div class="first">
  61. <div class="title"><img src="/zinc/www/images/slogan.png"></div>
  62. <div class="intro">
  63. <div class="z-text-center z-text-white z-w300">
  64. <div class="z-mg-b20"><img src="/zinc/www/images/ico_dk.png" class="z-w120 z-h120"></div>
  65. <p class="z-px24 z-mg-b20 z-h25">ZhiqimDK</p>
  66. <p class="z-px15 z-lh25 z-mg-t10">一套颠覆传统Tomcat和servlet的完整型、开放型、创新型的技术体系。</p>
  67. <div class="z-mg-t15"><button class="z-button z-w80 z-h35" onclick="window.open('https://www.zhiqim.com/product/www/dkIntroduce.htm');">更多</button></div>
  68. </div>
  69. <div class="z-text-center z-text-white z-w300">
  70. <div class="z-mg-b20"><img src="/zinc/www/images/ico_studio.png" class="z-w120 z-h120"></div>
  71. <p class="z-px24 z-mg-b20 z-h25">ZhiqimStudio</p>
  72. <p class="z-px15 z-lh25">快速搭建基于ZhiqimDK的web工程,大幅提升HTML、js、css的开发效率。</p>
  73. <div class="z-mg-t15"><button class="z-button z-w80 z-h35" onclick="window.open('https://www.zhiqim.com/product/www/studioIntroduce.htm');">更多</button></div>
  74. </div>
  75. <div class="z-text-center z-text-white z-w300">
  76. <div class="z-mg-b20"><img src="/zinc/www/images/ico_pm.png" class="z-w120 z-h120"></div>
  77. <p class="z-px24 z-mg-b20 z-h25">ZhiqimPM</p>
  78. <p class="z-px15 z-lh25">一款融合了代码托管、协同开发、开发过程管理的强大的软件管理工具。</p>
  79. <div class="z-mg-t15"><button class="z-button z-w80 z-h35" onclick="window.open('https://www.zhiqim.com/product/www/pmIntroduce.htm');">更多</button></div>
  80. </div>
  81. </div>
  82. <div class="z-w100p count"><span id="programmersNum">0</span><span class="z-sup">+</span> 程序员,<span id="companiesNum">0</span><span class="z-sup">+</span> 家公司正在使用</div>
  83. </div>
  84. </div>
  85. <!--产品-->
  86. <div data-role="z-screen" class="section" id="third">
  87. <div class="third z-pd-l20">
  88. <div class="z-float-left z-hide z-w40p z-h100p z-text-left"><img src="/zinc/www/images/product.png"> </div>
  89. <div class="z-float-right z-w60p z-text-left z-pd-l20" style="margin-top:50px;">
  90. <div class="sectiontitle">gitsolo</div>
  91. <div class="z-px18 z-color-333 z-lh25">gitsolo是首个独立命名,由知启蒙团队自主研发的一个极简的git仓库管理器,支持HTT(S)协议,包含部门角色权限等管理,用户可在此基础上进行二次开发,也可作为其他大项目下的组件使用。
  92. <span class="z-mg-l10 z-color-666 z-px14">(Demo用户名:zhiqim <span class="z-mg-l10">密码:</span>zhiqim@2015)</span>
  93. </div>
  94. <div class="productfont">
  95. <ul>
  96. <li>依赖于zhiqim_manager,自带管理和权限功能。</li>
  97. <li>集成了sqlite文件数据库,安装使用方便。</li>
  98. <li>全程自主研发,无外部包依赖,开发环境纯净。</li>
  99. <li>安装简单,启动容易,一键式启动方式。</li>
  100. <li>隶属于zhiqim_pm下的,基于git规范的开源代码仓库系统</li>
  101. </ul>
  102. </div>
  103. <div class="z-mg-t20 z-w100p">
  104. <button class="z-button z-xlarge z-orange z-w140" onclick="window.open('${context.getRootPath("http://gitsolo.demo.zhiqim.com")}')">Demo体验</button>
  105. <button class="z-button z-xlarge z-blue z-w140 z-mg-l10" onclick="Z.L.href('${context.getRootPath("/product/www/gitsoloIntroduce.htm")}');">查看详情</button>
  106. </div>
  107. </div>
  108. </div>
  109. </div>
  110. <!--组件-->
  111. <div data-role="z-screen" class="section" id="second">
  112. <div class="second">
  113. <div class="z-float-left z-hide z-w40p z-h100p z-text-center"><img src="/zinc/www/images/component.png"></div>
  114. <div class="z-float-right z-w60p z-text-left brief">
  115. <table class="z-table z-pd6">
  116. <tr>
  117. <td colspan="2"><div class="sectiontitle">组件中心</div></td>
  118. </tr>
  119. <tr>
  120. <td><i class="z-mg-r5"><img src="/zinc/www/images/one.png"/></i><span class="z-px20">可重用性</span></td>
  121. <td><i class="z-mg-r5"><img src="/zinc/www/images/two.png"/></i><span class="z-px20">组件可扩展性</span></td>
  122. </tr>
  123. <tr>
  124. <td><i class="z-mg-r5"><img src="/zinc/www/images/three.png"/></i><span class="z-px20">组件类型多样化</span></td>
  125. <td><i class="z-mg-r5"><img src="/zinc/www/images/four.png"/></i><span class="z-px20">缩短软件开发周期 提高效率</span></td>
  126. </tr>
  127. <tr class="z-h120">
  128. <td colspan="2"><span class="z-px18 z-lh30">组件是封装了一个或多个实体程序模块的实体。采用类似于搭积木的方法快速的形成新的组件或产品,不仅可以缩短软件项目的开发周期,同时也提高了系统的稳定性。知启蒙现已形成如zhiqim_manager、zhiqim_account等多个组件。</span></td>
  129. </tr>
  130. <tr class="z-h60">
  131. <td colspan="2"><a class="z-lh30" href="https://www.zhiqim.com/gitcan/index.htm">了解更多》</a></td>
  132. </tr>
  133. </table>
  134. </div>
  135. </div>
  136. </div>
  137. <!--关于我们-->
  138. <div data-role="z-screen" class="section" id="fourth">
  139. <div class="fourth">
  140. <div class="z-float-left z-hide z-w40p z-h100p z-text-center"><img src="/zinc/www/images/aboutus.png"> </div>
  141. <div class="z-float-right z-w60p z-text-left brief">
  142. <div class="corporate">关于知启蒙</div>
  143. <div class="z-lh30 z-color-333 z-px18">
  144. <p>湖南知启蒙科技有限公司专业致力于互联网领域,是集互联网平台,技术框架,技术组件等开发服务于一体的网络科技公司,公司凭借多年在互联网等信息领域的沉淀积累,为客户提供了优质的互联网产品及服务。</p>
  145. <p>知启蒙技术平台是由知启蒙团队开发的整合Java & HTML5,前后端于一体的技术体系,其特点为积木式组件模块化和模型模板化。</p>
  146. <p>我们拥有<br>
  147. ----安全、轻便的技术框架<br>
  148. ----先进、专业的技术支持<br>
  149. ----多样、强大的技术组件
  150. </p>
  151. </div>
  152. </div>
  153. </div>
  154. </div>
  155. ${zhiqim_com_footer()}