index1.html 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  6. <meta name="description" content="" />
  7. <meta name="keywords" content="" />
  8. <title>首页</title>
  9. <!-- 重置css -->
  10. <link rel="stylesheet" type="text/css" href="./css/reset.css" />
  11. <!-- bootstrap css -->
  12. <link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css" />
  13. <!-- 动画样式 -->
  14. <link rel="stylesheet" type="text/css" href="./css/animate.min.css" />
  15. <!-- 轮播样式 -->
  16. <link href="./css/swiper.min.css" rel='stylesheet' type='text/css' />
  17. <link href="./css/fullpage.css" rel='stylesheet' type='text/css' />
  18. <!-- 公共css -->
  19. <link rel="stylesheet" type="text/css" href="./css/global.css" />
  20. <!-- 私有css -->
  21. <link rel="stylesheet" type="text/css" href="./css/index.css" />
  22. <link rel="stylesheet" type="text/css" href="./css/banner.css" />
  23. <script src="./js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
  24. <script src="./js/bootstrap.min.js"></script>
  25. <script src="./js/jquery.easing.1.3.umd.min.js"></script>
  26. <!-- 如果 scrollOverflow 设置为 true,则需要引入 jquery.slimscroll.min.js,一般情况下不需要 -->
  27. <script src="./js/jquery.slimscroll.min.js"></script>
  28. <script src="./js/fullpage.js"></script>
  29. <script type="text/javascript" src='./js/swiper.min.js'></script>
  30. <script type="text/javascript" src='./js/main.js'></script>
  31. </head>
  32. <body>
  33. <!--通用顶部导航-->
  34. <!-- <div id="head"></div>
  35. <script type="text/javascript">
  36. $('#head').load('./componen/header.html')
  37. </script> -->
  38. <div class="head_wrap" id="nav">
  39. <div class="flex_div">
  40. <a href="index.html" class="logo">
  41. <img class="img-fluid" src="./imgs/cecf.png" alt='' />
  42. </a>
  43. <nav class="navbar navbar-expand-lg text-right" role="navigation">
  44. <div class="navbar-header">
  45. <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#example-navbar-collapse">
  46. <span class="sr-only">切换导航</span>
  47. <span class="icon-bar"></span>
  48. <span class="icon-bar"></span>
  49. <span class="icon-bar"></span>
  50. </button>
  51. <!-- <a class="navbar-brand" href="#">首页</a> -->
  52. </div>
  53. <div class="collapse navbar-collapse" id="example-navbar-collapse">
  54. <ul class="nav navbar-nav">
  55. <li class="active"><a href="index.html">首页</a></li>
  56. <li><a href="detect.html">感知探测</a></li>
  57. <li><a href="visual.html">可视化</a></li>
  58. <li><a href="basic.html">基础功能</a></li>
  59. <li><a href="analyse.html">分析</a></li>
  60. <li><a href="devops.html">运维</a></li>
  61. <li><a href="manage.html">管理</a></li>
  62. <li><a href="safety.html">安全</a></li>
  63. <!-- <li class="dropdown">
  64. <a href="#" class="dropdown-toggle" data-toggle="dropdown">
  65. asp.net <b class="caret"></b>
  66. </a>
  67. <ul class="dropdown-menu">
  68. <li><a href="#">asp.net初级</a></li>
  69. <li><a href="#">asp.net中级</a></li>
  70. <li><a href="#">asp.net高级</a></li>
  71. </ul>
  72. </li> -->
  73. </ul>
  74. </div>
  75. </nav>
  76. </div>
  77. </div>
  78. <!--通用顶部导航 结束-->
  79. <!-- banner 开始 -->
  80. <!-- <div class="banner_wrap">
  81. <div class="container">
  82. <div class="banner_content">
  83. <div class="main-content-1">企业级研发管理工具</div>
  84. <div class="main-content-1-sub">更强大的团队协作与项目管理工具,助力企业更好更快发布产品</div>
  85. </div>
  86. </div>
  87. </div> -->
  88. <div class="top index-top tilt-component">
  89. <div class="index-bg-wrapper">
  90. <div class="index-bg-container">
  91. <!-- 蓝色背景 -->
  92. <div class="index-bg-grid">
  93. <div class="grid-block"></div>
  94. <div class="grid-tria"></div>
  95. </div>
  96. <div class="index-bg-grid">
  97. <div class="grid-block"></div>
  98. <div class="grid-tria"></div>
  99. </div>
  100. <div class="index-bg-grid">
  101. <div class="grid-block"></div>
  102. <div class="grid-tria"></div>
  103. </div>
  104. <div class="index-bg-grid">
  105. <div class="grid-block"></div>
  106. <div class="grid-tria"></div>
  107. </div>
  108. <div class="index-bg-grid">
  109. <div class="grid-block"></div>
  110. <div class="grid-tria"></div>
  111. </div>
  112. <div class="index-bg-grid">
  113. <div class="grid-block"></div>
  114. <div class="grid-tria"></div>
  115. </div>
  116. <div class="index-bg-grid">
  117. <div class="grid-block"></div>
  118. <div class="grid-tria"></div>
  119. </div>
  120. <div class="index-bg-grid">
  121. <div class="grid-block"></div>
  122. <div class="grid-tria"></div>
  123. </div>
  124. <div class="index-bg-grid">
  125. <div class="grid-block"></div>
  126. <div class="grid-tria"></div>
  127. </div>
  128. <div class="index-bg-grid">
  129. <div class="grid-block"></div>
  130. <div class="grid-tria"></div>
  131. </div>
  132. <div class="index-bg-grid">
  133. <div class="grid-block"></div>
  134. <div class="grid-tria"></div>
  135. </div>
  136. <div class="index-bg-grid">
  137. <div class="grid-block"></div>
  138. <div class="grid-tria"></div>
  139. </div>
  140. <div>
  141. <div class="index-bg-line"></div>
  142. <div class="index-bg-line"></div>
  143. <div class="index-bg-line"></div>
  144. <div class="index-bg-line"></div>
  145. <div class="index-bg-line"></div>
  146. <div class="index-bg-line"></div>
  147. <div class="index-bg-line"></div>
  148. <div class="index-bg-line"></div>
  149. <div class="index-bg-line"></div>
  150. <div class="index-bg-line"></div>
  151. <div class="index-bg-line"></div>
  152. </div>
  153. <div>
  154. <div class="index-bg-round"></div>
  155. <div class="index-bg-round"></div>
  156. <div class="index-bg-round"></div>
  157. <div class="index-bg-round"></div>
  158. <div class="index-bg-round"></div>
  159. <div class="index-bg-round"></div>
  160. <div class="index-bg-round"></div>
  161. <div class="index-bg-round"></div>
  162. <div class="index-bg-round"></div>
  163. <div class="index-bg-round"></div>
  164. <div class="index-bg-round"></div>
  165. </div>
  166. </div>
  167. </div>
  168. <div class="triangle-top-cover"></div>
  169. <div class="top-bg-color"></div>
  170. <div class="top-content normal-width">
  171. <div class="top-content-sub-bg-img">
  172. <img class="rocket-m" src="./imgs/index-back-imgX3-cc66504e6c.png" alt="bg-icon" width="478" height="445">
  173. <div class="rocket-wrapper">
  174. <img id="rocket_block_left_1" src="./imgs/block-left-1X3-a765980ff6.png" alt="" width="155" height="154" class="end" style="animation: 4s linear 3.7s infinite normal none running rocket_block_left_1;"> <img id="rocket_block_left_2"
  175. src="./imgs/block-left-2X3-86d2859b25.png" alt="" width="163" height="164" data-src3x="./imgs/block-left-2X3-86d2859b25.png" data-src1x="./imgs/block-left-2-62323fda71.png" class="end"> <img id="rocket_block_right_1" src="./imgs/block-right-1X3-e355643d84.png"
  176. alt="" width="154" height="165" data-src3x="./imgs/block-right-1X3-e355643d84.png" data-src1x="./imgs/block-right-1-1045a28895.png" class="end">
  177. <!-- <img id="rocket_block_right_2"
  178. src="./imgs/block-right-2X3-c9a35cf4cf.png" alt="" width="189" height="189"
  179. data-src3x="./imgs/block-right-2X3-c9a35cf4cf.png"
  180. data-src1x="./imgs/block-right-2-d3165e3ef5.png" class="end"
  181. style="animation: 4s linear 3.7s infinite normal none running rocket_block_right_2;"> -->
  182. <img id="rocket_body" src="./imgs/rocket-bodyX3-43fd3f57fb.png" alt="" width="405" height="459" data-src3x="./imgs/rocket-bodyX3-43fd3f57fb.png" data-src1x="./imgs/rocket-body-6208e0a508.png" class="end" style="animation: 2s linear 2.2s infinite normal none running rocket_body;"> <img id="rocket_halo_XS" src="./imgs/halo-topX3-9cbbd2c07a.png" alt="" width="79" height="53" data-src3x="./imgs/halo-topX3-9cbbd2c07a.png" data-src1x="./imgs/halo-top-d64a0d363d.png" class="end" style="animation: 2s linear 2.2s infinite normal none running rocket_halo_XS;">
  183. <!-- <img
  184. id="rocket_halo_S" src="./imgs/halo-bottomX3-4b585da51f.png" alt="" width="124" height="82"
  185. data-src3x="./imgs/halo-bottomX3-4b585da51f.png" data-src1x="./imgs/halo-bottom-7dd205996e.png"
  186. class="end" style="animation: 2s linear 2.2s infinite normal none running rocket_halo_S;"> -->
  187. <img id="rocket_halo_L_fadeout" src="./imgs/halo-middle-fadeoutX3-df5f9b82b8.png" alt="" width="308" height="165" data-src3x="./imgs/halo-middle-fadeoutX3-df5f9b82b8.png" data-src1x="./imgs/halo-middle-fadeout-87dc6a21cb.png" class="end" style="animation: 2s linear 2.2s infinite normal none running rocket_halo_L_fadeout;">
  188. <img id="rocket_tail_L" src="./imgs/tail-largeX3-af82501804.png" alt="" width="166" height="219" data-src3x="./imgs/tail-largeX3-af82501804.png" data-src1x="./imgs/tail-large-8dc82e6531.png" class="end" style="animation: 2s linear 2.2s infinite normal none running rocket_tail_L;">
  189. <img id="rocket_tail_S" src="./imgs/tail-smallX3-334f9cbb55.png" alt="" width="126" height="162" data-src3x="./imgs/tail-smallX3-334f9cbb55.png" data-src1x="./imgs/tail-small-9dfa10b24f.png" class="end" style="animation: 2s linear 2.2s infinite normal none running rocket_tail_S;"> <img id="rocket_halo_L" src="./imgs/halo-middleX3-df5f9b82b8.png" alt="" width="308" height="165" data-src3x="./imgs/halo-middleX3-df5f9b82b8.png" data-src1x="./imgs/halo-middle-87dc6a21cb.png" class="end" style="animation: 2s linear 2.2s infinite normal none running rocket_halo_L;">
  190. </div>
  191. </div>
  192. <div class="top-content-slogan">
  193. <div class="main-content-1">企业级研发管理工具</div>
  194. <div class="main-content-1-sub">更强大的团队协作与项目管理工具,助力企业更好更快发布产品</div>
  195. </div>
  196. <!-- <div class="top-content-try">
  197. <div class="top-content-try-button top track-web-click"><span>免费试用</span></div>
  198. </div> -->
  199. <div class="top-content-data-content">
  200. <div class="top-content-data-number">+<span id="index_bg_number_1">827</span>%
  201. <div class="top-content-arrow-up"><img src="https://cdn2.ones-ai.cn/images/index/arrow-upX3-32f0c6aea4.png" width="15" height="14" data-src3x="https://cdn2.ones-ai.cn/images/index/arrow-upX3-32f0c6aea4.png" data-src1x="https://cdn2.ones-ai.cn/images/index/arrow-up-7a9ac6e5f0.png"></div>
  202. <div class="top-content-data-content">需求响应速度提升</div>
  203. </div>
  204. <div class="top-content-data-number">+<span id="index_bg_number_2">72</span>%
  205. <div class="top-content-arrow-up"><img src="https://cdn2.ones-ai.cn/images/index/arrow-upX3-32f0c6aea4.png" width="15" height="14" data-src3x="https://cdn2.ones-ai.cn/images/index/arrow-upX3-32f0c6aea4.png" data-src1x="https://cdn2.ones-ai.cn/images/index/arrow-up-7a9ac6e5f0.png"></div>
  206. <div class="top-content-data-content">交付效率提升</div>
  207. </div>
  208. <div class="top-content-data-number">+<span id="index_bg_number_3">180</span>%
  209. <div class="top-content-arrow-up"><img src="https://cdn2.ones-ai.cn/images/index/arrow-upX3-32f0c6aea4.png" width="15" height="14" data-src3x="https://cdn2.ones-ai.cn/images/index/arrow-upX3-32f0c6aea4.png" data-src1x="https://cdn2.ones-ai.cn/images/index/arrow-up-7a9ac6e5f0.png"></div>
  210. <div class="top-content-data-content">交付质量提升</div>
  211. </div>
  212. </div>
  213. </div>
  214. </div>
  215. <!-- banner 结束 -->
  216. <!-- 产品 -->
  217. <div class="index-content">
  218. <div class="container">
  219. <div class="swiper-container swiper-container-h">
  220. <div class="swiper-wrapper">
  221. <div class="swiper-slide">
  222. <div class="main_title">感知探测类产品</div>
  223. <div class="swiper-container swiper-container-v1">
  224. <div class="swiper-wrapper">
  225. <div class="swiper-slide">
  226. <div class="product_info_wrap flex_div">
  227. <a href="detect.html" class="flex_div product_info">
  228. <div class="product_img">
  229. <img class="img-fluid" src="./imgs/product.png" />
  230. </div>
  231. <div>
  232. <div class="product_main_title">网络质量感知探测系统</div>
  233. <div class="product_sub_title">CECF Network</div>
  234. </div>
  235. </a>
  236. <div class="product_desc">
  237. <div class="desc">
  238. 建立综合的网络质量探测手段,全面评价网络质量 ,精准定位问题原因,快速解决故障。
  239. </div>
  240. <a class="product_detail" href="">
  241. 了解详情
  242. </a>
  243. </div>
  244. </div>
  245. <div class="flow_chart">
  246. <img style="width:100%;" class="img-fluid" src="./imgs/n_line1.jpg" />
  247. </div>
  248. </div>
  249. <div class="swiper-slide">
  250. <div class="product_info_wrap flex_div">
  251. <a href="detect.html" class="flex_div product_info">
  252. <div class="product_img">
  253. <img class="img-fluid" src="./imgs/product.png" />
  254. </div>
  255. <div>
  256. <div class="product_main_title">WEB/APP仿真模拟探测系统</div>
  257. <div class="product_sub_title">CECF WEB/APP</div>
  258. </div>
  259. </a>
  260. <div class="product_desc">
  261. <div class="desc">
  262. 采用终端仿真探测方式,是基于GUI模拟营业员的真实体验,采用虚拟用户机制自动向系统发起业务操作,真正实现端到端的业务仿真探测。将系统性能和可用性细分到业务详细步骤,并在探测时获取页面截图,适用业务办理类和查询类业务。
  263. </div>
  264. <a class="product_detail" href="">
  265. 了解详情
  266. </a>
  267. </div>
  268. </div>
  269. <div class="flow_chart">
  270. <img style="width:100%;" class="img-fluid" src="./imgs/n_line1.jpg" />
  271. </div>
  272. </div>
  273. <div class="swiper-slide">
  274. <div class="product_info_wrap flex_div">
  275. <a href="detect.html" class="flex_div product_info">
  276. <div class="product_img">
  277. <img class="img-fluid" src="./imgs/product.png" />
  278. </div>
  279. <div>
  280. <div class="product_main_title">协议探测平台</div>
  281. <div class="product_sub_title">CECF TCP</div>
  282. </div>
  283. </a>
  284. <div class="product_desc">
  285. <div class="desc">
  286. 通信协议探测系统,通过HTTP等协议探测方式,获取系统性能和可用性数据,适用各类业务办理类和查询类业务,实现全天不间断探测。
  287. </div>
  288. <a class="product_detail" href="">
  289. 了解详情
  290. </a>
  291. </div>
  292. </div>
  293. <div class="flow_chart">
  294. <img style="width:100%;" class="img-fluid" src="./imgs/n_line1.jpg" />
  295. </div>
  296. </div>
  297. </div>
  298. <div class="swiper-pagination swiper-pagination-v"></div>
  299. </div>
  300. </div>
  301. <div class="swiper-slide">
  302. <div class="main_title">分析类产品</div>
  303. <div class="swiper-container swiper-container-v2">
  304. <div class="swiper-wrapper">
  305. <div class="swiper-slide">
  306. <div class="product_info_wrap flex_div">
  307. <a href="detect.html" class="flex_div product_info">
  308. <div class="product_img">
  309. <img class="img-fluid" src="./imgs/product.png" />
  310. </div>
  311. <div>
  312. <div class="product_main_title">业务深度分析系统</div>
  313. <div class="product_sub_title">CECF Analyse</div>
  314. </div>
  315. </a>
  316. <div class="product_desc">
  317. <div class="desc">
  318. 建立综合的网络质量探测手段,全面评价网络质量 ,精准定位问题原因,快速解决故障。
  319. </div>
  320. <a class="product_detail" href="">
  321. 了解详情
  322. </a>
  323. </div>
  324. </div>
  325. <div class="flow_chart">
  326. <img style="width:100%;" class="img-fluid" src="./imgs/n_line1.jpg" />
  327. </div>
  328. </div>
  329. <div class="swiper-slide">
  330. <div class="product_info_wrap flex_div">
  331. <a href="detect.html" class="flex_div product_info">
  332. <div class="product_img">
  333. <img class="img-fluid" src="./imgs/product.png" />
  334. </div>
  335. <div>
  336. <div class="product_main_title">运维运营分析系统</div>
  337. <div class="product_sub_title">CECF Operation</div>
  338. </div>
  339. </a>
  340. <div class="product_desc">
  341. <div class="desc">
  342. 对于一家公司来说,数据是反应一个公司近日的发展状态如何,得知近日的发展状态是处于向上、稳定、向下的情况。其次可以通过具体的数据分析、得到具体分析结果,例如你的目标用户、用户的行踪、某一块功能是的使用情况、转化率、留存率等等情况,本平台的开发为了得知公司和整个市场的总体情况和未来的发展趋势,从而满足客户契合度,提高用户粘性
  343. </div>
  344. <a class="product_detail" href="">
  345. 了解详情
  346. </a>
  347. </div>
  348. </div>
  349. <div class="flow_chart">
  350. <img style="width:100%;" class="img-fluid" src="./imgs/n_line1.jpg" />
  351. </div>
  352. </div>
  353. </div>
  354. <div class="swiper-pagination swiper-pagination-v"></div>
  355. </div>
  356. </div>
  357. <div class="swiper-slide">
  358. <div class="main_title">运维类产品</div>
  359. <div class="swiper-container swiper-container-v3">
  360. <div class="swiper-wrapper">
  361. <div class="swiper-slide">
  362. <div class="product_info_wrap flex_div">
  363. <a href="detect.html" class="flex_div product_info">
  364. <div class="product_img">
  365. <img class="img-fluid" src="./imgs/product.png" />
  366. </div>
  367. <div>
  368. <div class="product_main_title">操作控制系统</div>
  369. <div class="product_sub_title">CECF Operation</div>
  370. </div>
  371. </a>
  372. <div class="product_desc">
  373. <div class="desc">
  374. 建立综合的网络质量探测手段,全面评价网络质量 ,精准定位问题原因,快速解决故障。
  375. </div>
  376. <a class="product_detail" href="">
  377. 了解详情
  378. </a>
  379. </div>
  380. </div>
  381. <div class="flow_chart">
  382. <img style="width:100%;" class="img-fluid" src="./imgs/n_line1.jpg" />
  383. </div>
  384. </div>
  385. <div class="swiper-slide">
  386. <div class="product_info_wrap flex_div">
  387. <a href="detect.html" class="flex_div product_info">
  388. <div class="product_img">
  389. <img class="img-fluid" src="./imgs/product.png" />
  390. </div>
  391. <div>
  392. <div class="product_main_title">网络割接系统</div>
  393. <div class="product_sub_title">CECF Cut</div>
  394. </div>
  395. </a>
  396. <div class="product_desc">
  397. <div class="desc">
  398. 采用终端仿真探测方式,是基于GUI模拟营业员的真实体验,采用虚拟用户机制自动向系统发起业务操作,真正实现端到端的业务仿真探测。将系统性能和可用性细分到业务详细步骤,并在探测时获取页面截图,适用业务办理类和查询类业务。
  399. </div>
  400. <a class="product_detail" href="">
  401. 了解详情
  402. </a>
  403. </div>
  404. </div>
  405. <div class="flow_chart">
  406. <img style="width:100%;" class="img-fluid" src="./imgs/n_line1.jpg" />
  407. </div>
  408. </div>
  409. <div class="swiper-slide">
  410. <div class="product_info_wrap flex_div">
  411. <a href="detect.html" class="flex_div product_info">
  412. <div class="product_img">
  413. <img class="img-fluid" src="./imgs/product.png" />
  414. </div>
  415. <div>
  416. <div class="product_main_title">知识库系统</div>
  417. <div class="product_sub_title">CECF Knowledge</div>
  418. </div>
  419. </a>
  420. <div class="product_desc">
  421. <div class="desc">
  422. 通信协议探测系统,通过HTTP等协议探测方式,获取系统性能和可用性数据,适用各类业务办理类和查询类业务,实现全天不间断探测。
  423. </div>
  424. <a class="product_detail" href="">
  425. 了解详情
  426. </a>
  427. </div>
  428. </div>
  429. <div class="flow_chart">
  430. <img style="width:100%;" class="img-fluid" src="./imgs/n_line1.jpg" />
  431. </div>
  432. </div>
  433. </div>
  434. <div class="swiper-pagination swiper-pagination-v"></div>
  435. </div>
  436. </div>
  437. </div>
  438. <!-- 如果需要分页器 -->
  439. <!-- <div class="swiper-pagination swiper-pagination-h"></div> -->
  440. <!-- 如果需要导航按钮 -->
  441. <div class="swiper-button-prev arrow"></div>
  442. <div class="swiper-button-next arrow"></div>
  443. </div>
  444. </div>
  445. </div>
  446. <div class="footer">
  447. Copyright © 京ICP备15007694号 中电汇通版权所有
  448. </div>
  449. <!--通用底部导航-->
  450. <!-- <div id="footer"></div>
  451. <script type="text/javascript">
  452. $('#footer').load('componernt/footer.html')
  453. </script> -->
  454. <!--通用底部导航 结束-->
  455. </body>
  456. </html>