PageSourceSearch

https://m5stack.com/contact

html m5stack.com collected 2026-10-01 08:48:44 UTC 62,123 bytes, 1,649 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3
4<head>
5  <meta charset="UTF-8">
6<meta name="description" content="Get in touch with M5Stack for product inquiries, technical support, distribution opportunities, or partnership collaborations.">
7
8<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
9<meta name="viewport"
10  content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
11
12<meta property="og:site_name" content="m5stack-store">
13<meta property="og:url" content="https://m5stack.com/">
14<meta property="og:title" content="M5Stack - Modular Rapid ESP32 IoT Development Board - ESP32 dev kits">
15<meta property="og:type" content="website">
16<meta property="og:description"
17  content="Open-source modular toolkits for IoT devices based on ESP32-updated version of ESP8266. With stackable modules, user-friendly IDE, enabling rapid and high-quality prototyping, STEM education, engineering and mechanical use.">
18
19<meta name="twitter:card" content="summary_large_image">
20<meta name="twitter:title" content="M5Stack - Modular Rapid ESP32 IoT Development Board - ESP32 dev kits">
21<meta name="twitter:description"
22  content="Open-source modular toolkits for IoT devices based on ESP32-updated version of ESP8266. With stackable modules, user-friendly IDE, enabling rapid and high-quality prototyping, STEM education, engineering and mechanical use.">
23<meta name="google-site-verification" content="sL9LWvSfPwuzxRoSN1NNthvrsPAlRzOLELP_GKnYtF0">
24<meta name="facebook-domain-verification" content="c4s80x8sy9rvkz0rq0m3k4b7wrzw7v" />
25
26<!-- bing 验证 -->
27<meta name="msvalidate.01" content="BAB40AA3D60399ACD2A221528489EBAA" />
28
29<title>
30  Contact M5Stack | Sales, Support &amp; Partnerships
31</title>
32<link rel="stylesheet" type="text/css" href="https://static-cdn.m5stack.com/resource/public/compressed/styles/main.min.css?v=eshcpgc37n" />
33<!-- <link rel="stylesheet" type="text/css" href="https://static-cdn.m5stack.com/resource/public/compressed/styles/default.min.css" /> -->
34<link rel="icon" href="/assets/favicon.ico">
35<link rel="canonical" href="https://m5stack.com/">
36<script src="https://static-cdn.m5stack.com/resource/public/compressed/libs/jquery.min.js"></script>
vendor: 2 bytes, line 36
36
37<script src="https://static-cdn.m5stack.com/resource/public/compressed/libs/matter.min.js"></script>
37 <!-- 首页底部动画效果  -->
38<script src="https://static-cdn.m5stack.com/resource/public/compressed/libs/slick.min.js"></script>
vendor: 2 bytes, line 38
38
39<script src="https://static-cdn.m5stack.com/resource/public/compressed/libs/widget-qa/index.js"></script>
39
40<!-- 
40<script src="https://static-cdn.m5stack.com/resource/public/compressed/libs/marked.min.js"></script>
40 -->
41<!-- 
41<script src="https://static-cdn.m5stack.com/resource/public/compressed/libs/highlight.min.js"></script>
41 -->
42<script src="https://static-cdn.m5stack.com/resource/public/compressed/libs/widget-chat/index.js"></script>
vendor: 2 bytes, line 42
42
43<script src="https://static-cdn.m5stack.com/resource/public/compressed/libs/main.js"></script>
43
44
45<script
46    src="https://analytics.m5stack.com/api/script.js"
47    data-site-id="15c4f5941fb5"
48    defer
49></script>
49
50
51<!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 65 bytes, lines 51-52
51
52<script async src="https://www.googletagmanager.com/gtag/js?id=
52G-SPSBP6YSS0
vendor: 13 bytes, line 52
52"></script>
53<script>
54  
vendor: 141 bytes, lines 54-58
54window.dataLayer = window.dataLayer || [];
55  function gtag() { dataLayer.push(arguments); }
56  gtag('js', new Date());
57
58  gtag('config', '
58G-SPSBP6YSS0
vendor: 13 bytes, lines 58-62
58');
59
60
61
62  
62$(document).ready(function () {
63    /** 文件有修改,加入font-size: 14px; */
64    var proto = document.location.protocol, host = 'https://static-cdn.m5stack.com/resource/public/compressed/libs', url = host;
65    var x = document.getElementsByTagName('script')[0];
66
67    /* widget-qa */
68    // let qaJS = document.createElement('script');
69    // qaJS.type = 'text/javascript';
70    // qaJS.async = true;
71    // qaJS.src = url + '/widget-qa/index.js?version=1.0.6';
72    // x.parentNode.insertBefore(qaJS, x);
73    // qaJS.onload = function () {
74      window['qa'] = new WidgetQA('23px', '320px');
75    // };
76
77    /* widget-chat */
78    // let chatJS = document.createElement('script');
79    // chatJS.type = 'text/javascript';
80    // chatJS.async = true;
81    // chatJS.src = url + '/widget-chat/index.js?version=1.0.2';
82    // x.parentNode.insertBefore(chatJS, x);
83    // chatJS.onload = function () {
84      window['chat'] = new WidgetChat('23px', '250px');
85    // };
86
87    /** widget-send-button 插件 */
88    var options = { "call_to_action": "Message us", "position": "right", "button_color": "#FF6550", "facebook": "1751363605099380", "email": "[email protected]", "order": "facebook,email" };
89    var proto = document.location.protocol, host = "whatshelp.io", url = proto + "//static." + host;
90
91
92    var s = document.createElement('script');
93    s.type = 'text/javascript';
94    s.async = true;
95    s.src = url + '/widget-send-button/js/init.js';
96    s.onload = function () {
97      WhWidgetSendButton.init(host, proto, options);
98    };
99    x.parentNode.insertBefore(s, x);
100
101  });
102</script>
102
103
104<script type="application/ld+json">
105  {
106    "@context": "https://schema.org",
107    "@type": "Organization",
108    "name": "M5stack",
109    "url": "https://m5stack.com",
110    "logo": "https://static-cdn.m5stack.com/resource/public/assets/m5stack-logo.png",
111    "description": "Open-source modular toolkits for IoT devices based on ESP32-updated version of ESP8266. With stackable modules, user-friendly IDE, enabling rapid and high-quality prototyping, STEM education, engineering and mechanical use.",
112    "sameAs": [
113      "https://facebook.com/M5Stack",
114      "https://x.com/M5Stack",
115      "https://instagram.com/m5stack",
116      "https://youtube.com/m5stack",
117      "https://linkedin.com/company/m5stack"
118    ]
119  }
120</script>
120
121</head>
122
123<body class="pc">
124  <header>
125  <div class="header-container">
126    
127            <a class="logo">
128              <img src='https://static-cdn.m5stack.com/resource/public/assets/m5logo.svg' alt="m5stack" title="m5stack" />
129            </a>
130            
131              <div class="header-nav">
132  <div class="header-nav-ul">
133    
134
135        
136          <li class="header-nav-item" data-id='solution' data-ismb="false">
137            <a class="header-nav-item-a disabledHover"  >
138              Solution
139            </a>
140            <!-- <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/arrow.svg"> -->
141
142            <svg class="header-arrow-btn show-pc" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1"
143              viewBox="0 0 3.59 2.11" fill="currentColor">
144              <g>
145                <path class="fil0"
146                  d="M3.05 0.09c0.12,-0.12 0.32,-0.12 0.45,0 0.12,0.12 0.12,0.32 0,0.45l-1.48 1.48c-0.12,0.12 -0.32,0.12 -0.45,0l-1.48 -1.48c-0.12,-0.12 -0.12,-0.32 0,-0.45 0.12,-0.12 0.32,-0.12 0.45,0l1.25 1.25 1.25 -1.25z" />
147              </g>
148            </svg>
149
150            <span class="header-mbnav-btn show-mb"></span>
151          </li>
152
153          
154            <div id='solution' class="nav-dropdown">
155              <div class="dropdown-content-left">
156                
157  <div class="dropdown-item" data-id="0">
158
159    <a class="dropdown-item-li  border" 
160      href=/business >
161      
162          For Business
163    </a>
164
165    
166      <div class="dropdown-item-child">
167        
168          <a class="dropdown-child-li" href="/solution?id=1">
169            
170              <div class="dropdown-icon-wrapper">
171                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/solution/smart_factory.svg">
172              </div>
173              
174                Smart Factory
175          </a>
176          
177          <a class="dropdown-child-li" href="/solution?id=2">
178            
179              <div class="dropdown-icon-wrapper">
180                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/solution/smart_agriculture.svg">
181              </div>
182              
183                Smart Agriculture
184          </a>
185          
186          <a class="dropdown-child-li" href="/solution?id=3">
187            
188              <div class="dropdown-icon-wrapper">
189                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/solution/smart_retail.svg">
190              </div>
191              
192                Smart Retail
193          </a>
194          
195          <a class="dropdown-child-li" href="/solution?id=4 ">
196            
197              <div class="dropdown-icon-wrapper">
198                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/solution/weather_station.svg">
199              </div>
200              
201                Weather Station
202          </a>
203          
204      </div>
205      
206  </div>
207  
208  <div class="dropdown-item" data-id="1">
209
210    <a class="dropdown-item-li  border" 
211      href=/developers >
212      
213          For Developers
214    </a>
215
216    
217      <div class="dropdown-item-child">
218        
219          <a class="dropdown-child-li" href="/developers">
220            
221              <div class="dropdown-icon-wrapper">
222                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/solution/for_engineers.svg">
223              </div>
224              
225                For Developers
226          </a>
227          
228      </div>
229      
230  </div>
231  
232              </div>
233              
234                <div class="dropdown-content-right show-pc">
235                  <div class="dropdown-image">
236                    <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/solution/bg.webp" alt="Solution">
237                    
238                  </div>
239                </div>
240                
241            </div>
242            
243              
244          <li class="header-nav-item" data-id='store' data-ismb="false">
245            <a class="header-nav-item-a " href=https://shop.m5stack.com >
246              Store
247            </a>
248            <!-- <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/arrow.svg"> -->
249
250            <svg class="header-arrow-btn show-pc" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1"
251              viewBox="0 0 3.59 2.11" fill="currentColor">
252              <g>
253                <path class="fil0"
254                  d="M3.05 0.09c0.12,-0.12 0.32,-0.12 0.45,0 0.12,0.12 0.12,0.32 0,0.45l-1.48 1.48c-0.12,0.12 -0.32,0.12 -0.45,0l-1.48 -1.48c-0.12,-0.12 -0.12,-0.32 0,-0.45 0.12,-0.12 0.32,-0.12 0.45,0l1.25 1.25 1.25 -1.25z" />
255              </g>
256            </svg>
257
258            <span class="header-mbnav-btn show-mb"></span>
259          </li>
260
261          
262            <div id='store' class="nav-dropdown">
263              <div class="dropdown-content-left">
264                
265  <div class="dropdown-item" data-id="0">
266
267    <a class="dropdown-item-li  border" 
268      href=https://shop.m5stack.com/collections/controllers >
269      
270          Controllers
271    </a>
272
273    
274      <div class="dropdown-item-child">
275        
276          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/controllers/CORE">
277            
278              <div class="dropdown-icon-wrapper">
279                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/core.svg">
280              </div>
281              
282                Core
283          </a>
284          
285          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/controllers/STICK">
286            
287              <div class="dropdown-icon-wrapper">
288                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/stick.svg">
289              </div>
290              
291                Stick
292          </a>
293          
294          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/controllers/ATOM">
295            
296              <div class="dropdown-icon-wrapper">
297                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/atom.svg">
298              </div>
299              
300                Atom
301          </a>
302          
303          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/controllers/CARDPUTER">
304            
305              <div class="dropdown-icon-wrapper">
306                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/cardputer.svg">
307              </div>
308              
309                Cardputer
310          </a>
311          
312          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/controllers/STAMP">
313            
314              <div class="dropdown-icon-wrapper">
315                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/stamp.svg">
316              </div>
317              
318                Stamp
319          </a>
320          
321          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/controllers/E-PAPER">
322            
323              <div class="dropdown-icon-wrapper">
324                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/e_paper.svg">
325              </div>
326              
327                E-Paper
328          </a>
329          
330          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/controllers/CONTROLLERS-OTHERS">
331            
332              <div class="dropdown-icon-wrapper">
333                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/others.svg">
334              </div>
335              
336                Others
337          </a>
338          
339      </div>
340      
341  </div>
342  
343  <div class="dropdown-item" data-id="1">
344
345    <a class="dropdown-item-li  border" 
346      href=https://shop.m5stack.com/collections/unit >
347      
348          Unit
349    </a>
350
351    
352      <div class="dropdown-item-child">
353        
354          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-SENSOR">
355            
356              <div class="dropdown-icon-wrapper">
357                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/sensor.svg">
358              </div>
359              
360                Sensor
361          </a>
362          
363          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-ACTUATOR">
364            
365              <div class="dropdown-icon-wrapper">
366                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/actuator.svg">
367              </div>
368              
369                Actuator
370          </a>
371          
372          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-EXTENSION">
373            
374              <div class="dropdown-icon-wrapper">
375                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/extension.svg">
376              </div>
377              
378                Extension
379          </a>
380          
381          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-DRIVER">
382            
383              <div class="dropdown-icon-wrapper">
384                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/driver.svg">
385              </div>
386              
387                Driver
388          </a>
389          
390          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-HMI">
391            
392              <div class="dropdown-icon-wrapper">
393                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/hmi.svg">
394              </div>
395              
396                HMI
397          </a>
398          
399          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-AUDIO">
400            
401              <div class="dropdown-icon-wrapper">
402                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/audio.svg">
403              </div>
404              
405                Audio
406          </a>
407          
408          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-CAMERAS">
409            
410              <div class="dropdown-icon-wrapper">
411                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/camera.svg">
412              </div>
413              
414                Camera
415          </a>
416          
417          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-WIRELESS">
418            
419              <div class="dropdown-icon-wrapper">
420                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/wireless.svg">
421              </div>
422              
423                Wireless
424          </a>
425          
426          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-ETHERNET">
427            
428              <div class="dropdown-icon-wrapper">
429                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/ethernet.svg">
430              </div>
431              
432                Ethernet
433          </a>
434          
435          <a class="dropdown-child-li" href="https://shop.m5stack.com/collections/unit/UNIT-OTHERS">
436            
437              <div class="dropdown-icon-wrapper">
438                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/others.svg">
439              </div>
440              
441                Others
442          </a>
443          
444      </div>
445      
446  </div>
447  
448  <div class="dropdown-item" data-id="2">
449
450    <a class="dropdown-item-li  " 
451      href=https://shop.m5stack.com/collections/hobby >
452      
453        <div class="dropdown-icon-wrapper">
454          <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/hobby.svg">
455        </div>
456        
457          Hobby
458    </a>
459
460    
461  </div>
462  
463  <div class="dropdown-item" data-id="3">
464
465    <a class="dropdown-item-li  " 
466      href=https://shop.m5stack.com/collections/ai-hardware >
467      
468        <div class="dropdown-icon-wrapper">
469          <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/ai_hardware.svg">
470        </div>
471        
472          AI Hardware
473    </a>
474
475    
476  </div>
477  
478              </div>
479              
480                <div class="dropdown-content-right show-pc">
481                  <div class="dropdown-image">
482                    <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/bg.webp" alt="Store">
483                    
484                      <a class="image-button" href="https://shop.m5stack.com">
485                        <img class="image-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/store/official_shop.svg">
486                        Official Shop
487                      </a>
488                      
489                  </div>
490                </div>
491                
492            </div>
493            
494              
495          <li class="header-nav-item" data-id='software' data-ismb="false">
496            <a class="header-nav-item-a disabledHover"  >
497              Software
498            </a>
499            <!-- <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/arrow.svg"> -->
500
501            <svg class="header-arrow-btn show-pc" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1"
502              viewBox="0 0 3.59 2.11" fill="currentColor">
503              <g>
504                <path class="fil0"
505                  d="M3.05 0.09c0.12,-0.12 0.32,-0.12 0.45,0 0.12,0.12 0.12,0.32 0,0.45l-1.48 1.48c-0.12,0.12 -0.32,0.12 -0.45,0l-1.48 -1.48c-0.12,-0.12 -0.12,-0.32 0,-0.45 0.12,-0.12 0.32,-0.12 0.45,0l1.25 1.25 1.25 -1.25z" />
506              </g>
507            </svg>
508
509            <span class="header-mbnav-btn show-mb"></span>
510          </li>
511
512          
513            <div id='software' class="nav-dropdown">
514              <div class="dropdown-content-left">
515                
516  <div class="dropdown-item" data-id="0">
517
518    <a class="dropdown-item-li disabledHover border" 
519       >
520      
521          Coding IDE
522    </a>
523
524    
525      <div class="dropdown-item-child">
526        
527          <a class="dropdown-child-li" href="https://aiflow.m5stack.com/">
528            
529              <div class="dropdown-icon-wrapper">
530                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/aiflow.svg">
531              </div>
532              
533                AiFlow-Web (Zero Setup)
534          </a>
535          
536          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/aiflow/desktop">
537            
538              <div class="dropdown-icon-wrapper">
539                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/aiflow.svg">
540              </div>
541              
542                AiFlow-Desktop (Advanced)
543          </a>
544          
545          <a class="dropdown-child-li" href="https://flow.m5stack.com/">
546            
547              <div class="dropdown-icon-wrapper">
548                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/uiflow1.svg">
549              </div>
550              
551                UiFlow1
552          </a>
553          
554          <a class="dropdown-child-li" href="https://uiflow2.m5stack.com/">
555            
556              <div class="dropdown-icon-wrapper">
557                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/uiflow2.svg">
558              </div>
559              
560                UiFlow2
561          </a>
562          
563      </div>
564      
565  </div>
566  
567  <div class="dropdown-item" data-id="1">
568
569    <a class="dropdown-item-li  border" 
570      href=https://docs.m5stack.com/en/start?id=development%20tools >
571      
572          Developer Tools
573    </a>
574
575    
576      <div class="dropdown-item-child">
577        
578          <a class="dropdown-child-li" href="https://burner.m5stack.com/">
579            
580              <div class="dropdown-icon-wrapper">
581                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/m5burner.svg">
582              </div>
583              
584                Web Burner
585          </a>
586          
587          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/uiflow/m5burner/intro">
588            
589              <div class="dropdown-icon-wrapper">
590                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/m5burner.svg">
591              </div>
592              
593                M5Burner
594          </a>
595          
596          <a class="dropdown-child-li" href="https://block-designer.m5stack.com/">
597            
598              <div class="dropdown-icon-wrapper">
599                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/block_designer.svg">
600              </div>
601              
602                Block Designer
603          </a>
604          
605          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/guide/ezdata/ezdata_v2">
606            
607              <div class="dropdown-icon-wrapper">
608                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/ezdata.svg">
609              </div>
610              
611                EzData 2.0
612          </a>
613          
614          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/guide/easyloader/easyloader_packer">
615            
616              <div class="dropdown-icon-wrapper">
617                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/easyloader.svg">
618              </div>
619              
620                EasyLoader Packer
621          </a>
622          
623          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/guide/develop_tools/vlw_font_creator">
624            
625              <div class="dropdown-icon-wrapper">
626                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/vlw.svg">
627              </div>
628              
629                VLW Font Creator
630          </a>
631          
632      </div>
633      
634  </div>
635  
636  <div class="dropdown-item" data-id="2">
637
638    <a class="dropdown-item-li  border" 
639      href=https://docs.m5stack.com/en/download?id=usb%20driver >
640      
641          Device Driver
642    </a>
643
644    
645      <div class="dropdown-item-child">
646        
647          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/download?id=usb%20driver">
648            
649              <div class="dropdown-icon-wrapper">
650                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/usb.svg">
651              </div>
652              
653                Device USB Driver
654          </a>
655          
656      </div>
657      
658  </div>
659  
660              </div>
661              
662                <div class="dropdown-content-right show-pc">
663                  <div class="dropdown-image">
664                    <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/bg.webp" alt="Software">
665                    
666                  </div>
667                </div>
668                
669            </div>
670            
671              
672          <li class="header-nav-item" data-id='document' data-ismb="false">
673            <a class="header-nav-item-a " href=https://docs.m5stack.com/en/start >
674              Documentation
675            </a>
676            <!-- <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/arrow.svg"> -->
677
678            <svg class="header-arrow-btn show-pc" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1"
679              viewBox="0 0 3.59 2.11" fill="currentColor">
680              <g>
681                <path class="fil0"
682                  d="M3.05 0.09c0.12,-0.12 0.32,-0.12 0.45,0 0.12,0.12 0.12,0.32 0,0.45l-1.48 1.48c-0.12,0.12 -0.32,0.12 -0.45,0l-1.48 -1.48c-0.12,-0.12 -0.12,-0.32 0,-0.45 0.12,-0.12 0.32,-0.12 0.45,0l1.25 1.25 1.25 -1.25z" />
683              </g>
684            </svg>
685
686            <span class="header-mbnav-btn show-mb"></span>
687          </li>
688
689          
690            <div id='document' class="nav-dropdown">
691              <div class="dropdown-content-left">
692                
693  <div class="dropdown-item" data-id="0">
694
695    <a class="dropdown-item-li  border" 
696      href=https://docs.m5stack.com/en/products >
697      
698          Product Documents
699    </a>
700
701    
702      <div class="dropdown-item-child">
703        
704          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products?id=controllers-core">
705            
706              <div class="dropdown-icon-wrapper">
707                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/controllers.svg">
708              </div>
709              
710                Controllers
711          </a>
712          
713          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products?id=unit-sensor">
714            
715              <div class="dropdown-icon-wrapper">
716                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/unit.svg">
717              </div>
718              
719                Unit
720          </a>
721          
722          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products?id=for%20stick-sensor">
723            
724              <div class="dropdown-icon-wrapper">
725                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/for_stick.svg">
726              </div>
727              
728                For Stick
729          </a>
730          
731          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products?id=for%20stack-module">
732            
733              <div class="dropdown-icon-wrapper">
734                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/for_stack.svg">
735              </div>
736              
737                For Stack
738          </a>
739          
740          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products?id=for%20atom-atom%20kit">
741            
742              <div class="dropdown-icon-wrapper">
743                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/for_atom.svg">
744              </div>
745              
746                For Atom
747          </a>
748          
749          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products?id=for%20stamp-wireless">
750            
751              <div class="dropdown-icon-wrapper">
752                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/for_stamp.svg">
753              </div>
754              
755                For Stamp
756          </a>
757          
758          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products?id=hobby-drone">
759            
760              <div class="dropdown-icon-wrapper">
761                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/hobby.svg">
762              </div>
763              
764                Hobby
765          </a>
766          
767          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products?id=accessories-cable">
768            
769              <div class="dropdown-icon-wrapper">
770                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/accessories.svg">
771              </div>
772              
773                Accessories
774          </a>
775          
776      </div>
777      
778  </div>
779  
780  <div class="dropdown-item" data-id="1">
781
782    <a class="dropdown-item-li disabledHover border" 
783       >
784      
785          Platform
786    </a>
787
788    
789      <div class="dropdown-item-child">
790        
791          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/aiflow/usage">
792            
793              <div class="dropdown-icon-wrapper">
794                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/software/aiflow.svg">
795              </div>
796              
797                AIFlow
798          </a>
799          
800          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/uiflow/uiflow_web">
801            
802              <div class="dropdown-icon-wrapper">
803                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/uiflow1.svg">
804              </div>
805              
806                UiFlow1
807          </a>
808          
809          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/uiflow2/uiflow_web">
810            
811              <div class="dropdown-icon-wrapper">
812                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/uiflow2.svg">
813              </div>
814              
815                UiFlow2
816          </a>
817          
818          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/arduino/arduino_ide">
819            
820              <div class="dropdown-icon-wrapper">
821                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/arduino.svg">
822              </div>
823              
824                Arduino
825          </a>
826          
827          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/esp_idf/esp_idf">
828            
829              <div class="dropdown-icon-wrapper">
830                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/esp_idf.svg">
831              </div>
832              
833                ESP-IDF
834          </a>
835          
836          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/compute/overview">
837            
838              <div class="dropdown-icon-wrapper">
839                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/stackflow_ai.svg">
840              </div>
841              
842                Linux &amp; Edge AI
843          </a>
844          
845          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/stackflow/overview">
846            
847              <div class="dropdown-icon-wrapper">
848                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/stackflow_ai.svg">
849              </div>
850              
851                StackFlow AI
852          </a>
853          
854          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/homeassistant/overview">
855            
856              <div class="dropdown-icon-wrapper">
857                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/home_assistant.svg">
858              </div>
859              
860                Home Assistant
861          </a>
862          
863          <a class="dropdown-child-li" href="https://github.com/nanoframework/nanoFramework.M5Stack">
864            
865              <div class="dropdown-icon-wrapper">
866                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/nanoframework.svg">
867              </div>
868              
869                nanoFramework
870          </a>
871          
872          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/guide/product_guide">
873            
874              <div class="dropdown-icon-wrapper">
875                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/product_guide.svg">
876              </div>
877              
878                Product Guide
879          </a>
880          
881      </div>
882      
883  </div>
884  
885  <div class="dropdown-item" data-id="2">
886
887    <a class="dropdown-item-li disabledHover border" 
888       >
889      
890          Product Resources
891    </a>
892
893    
894      <div class="dropdown-item-child">
895        
896          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/learn/certification/certification">
897            
898              <div class="dropdown-icon-wrapper">
899                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/products_certification.svg">
900              </div>
901              
902                Product Certifications
903          </a>
904          
905          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/product_i2c_addr">
906            
907              <div class="dropdown-icon-wrapper">
908                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/i2c_table.svg">
909              </div>
910              
911                I2C Table
912          </a>
913          
914          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/products_selector/m5core_compare">
915            
916              <div class="dropdown-icon-wrapper">
917                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/product_selector.svg">
918              </div>
919              
920                Product Selector
921          </a>
922          
923          <a class="dropdown-child-li" href="https://github.com/m5stack/M5_Hardware">
924            
925              <div class="dropdown-icon-wrapper">
926                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/pcb_files.svg">
927              </div>
928              
929                Hardware Design Files
930          </a>
931          
932          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/history">
933            
934              <div class="dropdown-icon-wrapper">
935                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/history.svg">
936              </div>
937              
938                Release History
939          </a>
940          
941          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/compatible_stack">
942            
943              <div class="dropdown-icon-wrapper">
944                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/stack_compatibility.svg">
945              </div>
946              
947                Stack Compatibility
948          </a>
949          
950          <a class="dropdown-child-li" href="https://docs.m5stack.com/en/learn/extension/module">
951            
952              <div class="dropdown-icon-wrapper">
953                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/document/stack_screw_length.svg">
954              </div>
955              
956                Stack Screw Length
957          </a>
958          
959      </div>
960      
961  </div>
962  
963              </div>
964              
965            </div>
966            
967              
968          <li class="header-nav-item" data-id='aboutus' data-ismb="false">
969            <a class="header-nav-item-a disabledHover"  >
970              About Us
971            </a>
972            <!-- <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/arrow.svg"> -->
973
974            <svg class="header-arrow-btn show-pc" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1"
975              viewBox="0 0 3.59 2.11" fill="currentColor">
976              <g>
977                <path class="fil0"
978                  d="M3.05 0.09c0.12,-0.12 0.32,-0.12 0.45,0 0.12,0.12 0.12,0.32 0,0.45l-1.48 1.48c-0.12,0.12 -0.32,0.12 -0.45,0l-1.48 -1.48c-0.12,-0.12 -0.12,-0.32 0,-0.45 0.12,-0.12 0.32,-0.12 0.45,0l1.25 1.25 1.25 -1.25z" />
979              </g>
980            </svg>
981
982            <span class="header-mbnav-btn show-mb"></span>
983          </li>
984
985          
986            <div id='aboutus' class="nav-dropdown">
987              <div class="dropdown-content-left">
988                
989  <div class="dropdown-item" data-id="0">
990
991    <a class="dropdown-item-li disabledHover border" 
992       >
993      
994          About Us
995    </a>
996
997    
998      <div class="dropdown-item-child">
999        
1000          <a class="dropdown-child-li" href="/about-us">
1001            
1002              <div class="dropdown-icon-wrapper">
1003                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/about_m5stack.svg">
1004              </div>
1005              
1006                About M5Stack
1007          </a>
1008          
1009          <a class="dropdown-child-li" href="/brand-guidelines">
1010            
1011              <div class="dropdown-icon-wrapper">
1012                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/brand-guidelines.svg">
1013              </div>
1014              
1015                Brand Guidelines
1016          </a>
1017          
1018          <a class="dropdown-child-li" href="/events">
1019            
1020              <div class="dropdown-icon-wrapper">
1021                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/events.svg">
1022              </div>
1023              
1024                Events
1025          </a>
1026          
1027          <a class="dropdown-child-li" href="/explore?page=1">
1028            
1029              <div class="dropdown-icon-wrapper">
1030                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/news.svg">
1031              </div>
1032              
1033                News
1034          </a>
1035          
1036          <a class="dropdown-child-li" href="/explore?type=blog&amp;page=1">
1037            
1038              <div class="dropdown-icon-wrapper">
1039                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/blogs.png">
1040              </div>
1041              
1042                Blog
1043          </a>
1044          
1045      </div>
1046      
1047  </div>
1048  
1049  <div class="dropdown-item" data-id="1">
1050
1051    <a class="dropdown-item-li disabledHover border" 
1052       >
1053      
1054          Community
1055    </a>
1056
1057    
1058      <div class="dropdown-item-child">
1059        
1060          <a class="dropdown-child-li" href="/global-innovation-contest">
1061            
1062              <div class="dropdown-icon-wrapper">
1063                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/global_contest.svg">
1064              </div>
1065              
1066                Global Contest
1067          </a>
1068          
1069          <a class="dropdown-child-li" href="/project-hub?category_id=1&amp;page=1">
1070            
1071              <div class="dropdown-icon-wrapper">
1072                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/project_hub.png">
1073              </div>
1074              
1075                Project Hub
1076          </a>
1077          
1078          <a class="dropdown-child-li" href="https://github.com/m5stack">
1079            
1080              <div class="dropdown-icon-wrapper">
1081                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/github.svg">
1082              </div>
1083              
1084                GitHub
1085          </a>
1086          
1087          <a class="dropdown-child-li" href="https://discord.gg/ysQAWBUE9Q">
1088            
1089              <div class="dropdown-icon-wrapper">
1090                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/discord.svg">
1091              </div>
1092              
1093                Discord
1094          </a>
1095          
1096          <a class="dropdown-child-li" href="https://community.m5stack.com/">
1097            
1098              <div class="dropdown-icon-wrapper">
1099                <img class="dropdown-icon" src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/forum.svg">
1100              </div>
1101              
1102                Forum
1103          </a>
1104          
1105      </div>
1106      
1107  </div>
1108  
1109              </div>
1110              
1111                <div class="dropdown-content-right show-pc">
1112                  <div class="dropdown-image">
1113                    <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/aboutus/bg.webp" alt="About Us">
1114                    
1115                  </div>
1116                </div>
1117                
1118            </div>
1119            
1120              
1121          <li class="header-nav-item" data-id='contact' data-ismb="false">
1122            <a class="header-nav-item-a disabledHover"  >
1123              Contact
1124            </a>
1125            <!-- <img src="https://static-cdn.m5stack.com/resource/public/assets/nav/arrow.svg"> -->
1126
1127            <svg class="header-arrow-btn show-pc" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1"
1128              viewBox="0 0 3.59 2.11" fill="currentColor">
1129              <g>
1130                <path class="fil0"
1131                  d="M3.05 0.09c0.12,-0.12 0.32,-0.12 0.45,0 0.12,0.12 0.12,0.32 0,0.45l-1.48 1.48c-0.12,0.12 -0.32,0.12 -0.45,0l-1.48 -1.48c-0.12,-0.12 -0.12,-0.32 0,-0.45 0.12,-0.12 0.32,-0.12 0.45,0l1.25 1.25 1.25 -1.25z" />
1132              </g>
1133            </svg>
1134
1135            <span class="header-mbnav-btn show-mb"></span>
1136          </li>
1137
1138          
1139            <div id='contact' class="nav-dropdown">
1140              <div class="dropdown-content-left">
1141                
1142  <div class="dropdown-item" data-id="0">
1143
1144    <a class="dropdown-item-li  " 
1145      href=/contact >
1146      
1147          Email Us
1148    </a>
1149
1150    
1151  </div>
1152  
1153  <div class="dropdown-item" data-id="1">
1154
1155    <a class="dropdown-item-li  " 
1156      href=https://faq.m5stack.com >
1157      
1158          Tech Support
1159    </a>
1160
1161    
1162  </div>
1163  
1164              </div>
1165              
1166            </div>
1167            
1168              
1169  </div>
1170</div>
1171                
1172
1173                  <div class="language-option-box">
1174                    <div class="current-language">
1175                      <svg class="icon" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 1.32 1.32"
1176                        fill="currentColor">
1177                        <g>
1178                          <path class="fil0"
1179                            d="M0.66 0c0.18,0 0.35,0.07 0.47,0.19 0.12,0.12 0.19,0.28 0.19,0.47 0,0.18 -0.07,0.35 -0.19,0.47 -0.12,0.12 -0.28,0.19 -0.47,0.19 -0.18,0 -0.35,-0.07 -0.47,-0.19 -0.12,-0.12 -0.19,-0.28 -0.19,-0.47 0,-0.18 0.07,-0.35 0.19,-0.47 0.12,-0.12 0.28,-0.19 0.47,-0.19zm0.39 0.27c-0.1,-0.1 -0.24,-0.16 -0.39,-0.16 -0.15,0 -0.29,0.06 -0.39,0.16 -0.1,0.1 -0.16,0.24 -0.16,0.39 0,0.15 0.06,0.29 0.16,0.39 0.1,0.1 0.24,0.16 0.39,0.16 0.15,0 0.29,-0.06 0.39,-0.16 0.1,-0.1 0.16,-0.24 0.16,-0.39 0,-0.15 -0.06,-0.29 -0.16,-0.39z" />
1180                          <path class="fil0"
1181                            d="M0.09 0.51c-0.03,0 -0.05,-0.02 -0.05,-0.05 0,-0.03 0.02,-0.05 0.05,-0.05l1.14 0c0.03,0 0.05,0.02 0.05,0.05 0,0.03 -0.02,0.05 -0.05,0.05l-1.14 0z" />
1182                          <path class="fil0"
1183                            d="M0.09 0.92c-0.03,0 -0.05,-0.02 -0.05,-0.05 0,-0.03 0.02,-0.05 0.05,-0.05l1.14 0c0.03,0 0.05,0.02 0.05,0.05 0,0.03 -0.02,0.05 -0.05,0.05l-1.14 0z" />
1184                          <path class="fil0"
1185                            d="M0.62 1.21c0.02,0.02 0.02,0.06 0,0.08 -0.02,0.02 -0.06,0.02 -0.08,0 -0.07,-0.06 -0.13,-0.16 -0.16,-0.27 -0.04,-0.11 -0.06,-0.23 -0.06,-0.36 0,-0.13 0.02,-0.26 0.06,-0.36 0.04,-0.11 0.1,-0.21 0.16,-0.27 0.02,-0.02 0.06,-0.02 0.08,0 0.02,0.02 0.02,0.06 -0,0.08 -0.06,0.05 -0.1,0.13 -0.14,0.23 -0.03,0.09 -0.05,0.21 -0.05,0.33 0,0.12 0.02,0.23 0.05,0.33 0.03,0.1 0.08,0.18 0.14,0.23z" />
1186                          <path class="fil0"
1187                            d="M0.78 1.29c-0.02,0.02 -0.06,0.02 -0.08,-0 -0.02,-0.02 -0.02,-0.06 0,-0.08 0.06,-0.05 0.1,-0.13 0.14,-0.23 0.03,-0.09 0.05,-0.21 0.05,-0.33 0,-0.12 -0.02,-0.23 -0.05,-0.33 -0.03,-0.1 -0.08,-0.18 -0.14,-0.23 -0.02,-0.02 -0.02,-0.06 -0,-0.08 0.02,-0.02 0.06,-0.02 0.08,-0 0.07,0.06 0.13,0.16 0.16,0.27 0.04,0.11 0.06,0.23 0.06,0.36 0,0.13 -0.02,0.26 -0.06,0.36 -0.04,0.11 -0.1,0.21 -0.16,0.27z" />
1188                        </g>
1189                      </svg>
1190                      <div>
1191                        
1192                              <!-- <img class="flag" src="https://static-cdn.m5stack.com/resource/public/assets/nav/en.svg" /> -->
1193                              English
1194                              
1195                      </div>
1196                      <svg class="header-arrow-btn show-pc" xmlns="http://www.w3.org/2000/svg" xml:space="preserve"
1197                        version="1.1" viewBox="0 0 3.59 2.11" fill="currentColor">
1198                        <g>
1199                          <path class="fil0"
1200                            d="M3.05 0.09c0.12,-0.12 0.32,-0.12 0.45,0 0.12,0.12 0.12,0.32 0,0.45l-1.48 1.48c-0.12,0.12 -0.32,0.12 -0.45,0l-1.48 -1.48c-0.12,-0.12 -0.12,-0.32 0,-0.45 0.12,-0.12 0.32,-0.12 0.45,0l1.25 1.25 1.25 -1.25z" />
1201                        </g>
1202                      </svg>
1203                    </div>
1204                    <div class="language-dropdown-wrapper">
1205                      <div class="language-dropdown">
1206                        <div class="language-item" data-id="en">
1207                          <!-- <img class="flag" src="https://static-cdn.m5stack.com/resource/public/assets/nav/en.svg" /> -->
1208                          English</div>
1209                        
1210                            <div class="language-item" data-id="zh-cn">
1211                              <!-- <img class="flag" src="https://static-cdn.m5stack.com/resource/public/assets/nav/zh-cn.svg" /> -->
1212                              简体中文</div>
1213                            
1214                      </div>
1215                    </div>
1216                  </div>
1217
1218  </div>
1219  
1220</header>
1221
1222<script>
1223  $(document).ready(function () {
1224    let htmlLang = 'en';
1225    $(`.language-item[data-id=${htmlLang}]`).addClass('active');
1226  });
1227  $(".logo").click(function () {
1228    let path = window.location.pathname;
1229    if (/(\/zh-cn)/g.test(path)) {
1230      window.location.href = '/zh-cn';
1231    } else {
1232      window.location.href = '/';
1233    }
1234  });
1235
1236  $(".language-item").click(function (e) {
1237    let val = e.target.dataset.id;
1238    let path = window.location.pathname;
1239    let newPath = path;
1240    if (/(\/zh-cn)/g.test(path)) {
1241      newPath = path.replace(/(\/zh-cn)/, '');
1242    } else if (/(\/ja)/g.test(path)) {
1243      newPath = path.replace(/(\/ja)/, '');
1244    }
1245    if (val !== 'en') {
1246      newPath = '/' + val + newPath
1247    }
1248    window.location.pathname = newPath;
1249
1250  });
1251
1252
1253  const hideLangDropdown = function () {
1254    $(".language-dropdown-wrapper").hide();
1255    $(".current-language").removeClass('active');
1256  }
1257  const hideDropdown = function () {
1258    $(".nav-dropdown").hide();
1259    $(".header-nav-item").removeClass('active');
1260  }
1261  const setDropdownTop = function (classname) {
1262    let _scrollTop = window.scrollY || window.pageYOffset || document.documentElement.scrollTop
1263    let h = $('header')[0].clientHeight + 10;
1264    if (_scrollTop < h) {
1265      $(classname).css('top', `${h - _scrollTop}px`);
1266    }
1267  }
1268
1269
1270
1271  //mb
1272  $(".mobile-return-icon").click(function () {
1273    let htmlLang = 'en';
1274    window.location.pathname = htmlLang === 'en' ? '/' : '/zh-cn';
1275  });
1276  $(".mobile-nav-icon").click(function (ev) {
1277    $(ev.target).toggleClass('active');
1278    $(".header-nav").toggleClass('show');
1279    if ($(".header-nav").hasClass("show")) {
1280      let path = window.location.pathname;
1281      let idx = -1;
1282      //   if (/(\/about-us)/ig.test(path)) {
1283      //     idx = 4;
1284      //   } else if (/(\/solution)/ig.test(path)) {
1285      //     idx = 1;
1286      //   } else if (/(\/uiflow)/ig.test(path)) {
1287      //     idx = 3;
1288      //   } else if (/(\/explore)/ig.test(path)) {
1289      //     idx = 6;
1290      //   } else
1291      if (/^(\/||\/zh-cn)$/ig.test(path)) {
1292        idx = 0;
1293      }
1294      if (idx > -1) {
1295        $(`.header-nav-item:eq(${idx})`).addClass('selected');
1296      }
1297    }
1298  });
1299
1300
1301  if ('false' === 'false') {
1302    /* pc */
1303    $(".current-language").mouseover(function (ev) {
1304      $(".language-dropdown-wrapper").show();
1305      ev.target.classList.add('active');
1306      hideDropdown();
1307      setDropdownTop(".language-dropdown-wrapper");
1308    });
1309    $(".language-dropdown").mouseleave(function () {
1310      $(".language-dropdown-wrapper").fadeOut('fast');
1311      $(".current-language").removeClass('active');
1312    });
1313
1314    hideDropdown();
1315    $(".header-nav-item").mouseover(function (ev) {
1316      hideLangDropdown();
1317      let target = ev.target;
1318      if (target.tagName !== 'svg' && target.className.indexOf('header-nav-item-a') > -1) {
1319        target = target.parentElement;
1320      }
1321      hideDropdown();
1322      $(`#${target.dataset.id}`).show();
1323      target.classList.add('active');
1324      setDropdownTop(`#${target.dataset.id}`);
1325    });
1326
1327    $(".nav-dropdown").mouseleave(function () {
1328      $(".nav-dropdown").fadeOut('fast');
1329      $(".header-nav-item").removeClass('active');
1330    });
1331
1332    $(window).scroll(function (event) {
1333      hideLangDropdown();
1334      hideDropdown();
1335    });
1336  } else {
1337    /* mb */
1338    $(".current-language").click(function (ev) {
1339      $(".language-dropdown-wrapper").show();
1340      ev.target.classList.add('active');
1341      setDropdownTop(".language-dropdown-wrapper");
1342    });
1343
1344    /* 二级菜单*/
1345    $(".header-nav-item").click(function (e) {
1346      if (e.target.dataset.id === 'home') {
1347        let path = window.location.pathname;
1348        if (['/', '/en', '/zh-cn'].indexOf(path) > -1) {
1349          return;
1350        }
1351        if (/(\/zh-cn)/g.test(path)) {
1352          window.open('/zh-cn');
1353        } else {
1354          window.open('/');
1355        }
1356        return;
1357      }
1358
1359      if (e.target.dataset.ismb && e.target.dataset.ismb === "fal
1359se") return;
1360
1361      let target = e.target;
1362      let navUl = e.target.nextElementSibling;
1363      if (e.target.className.indexOf('header-mbnav-btn') > -1) {
1364        target = e.target.parentElement;
1365        navUl = e.target.parentElement.nextElementSibling;
1366      }
1367
1368      let targetId = target.dataset.id;
1369      $(`.header-nav-item[data-id!=${targetId}]`).removeClass('active');
1370      $(".dropdown-item").removeClass('active');
1371      $(target).toggleClass('active');
1372    });
1373    /* 三级菜单*/
1374    // $(".dropdown-nav-li[data-layout='1'][data-type='title']").click(function (e) {
1375    //   let target = e.target;
1376    //   let childrenNav = e.target.parentElement.nextElementSibling;
1377    //   if (!childrenNav) return;
1378    //   let targetId = target.parentElement.parentElement.dataset.id;
1379    //   $(`.dropdown-item[data-layout="1"][data-id!=${targetId}]`).removeClass('active');
1380    //   $(target.parentElement.parentElement).toggleClass('active');
1381    // });
1382  }
1383</script>
1383
1384  <div class="contact-form-wrapper">
1385  <div class="contact-form">
1386    <div class="form-container">
1387      
1388        <div class="form-left">
1389          <div class="form-left-title">
1390            M5STACK E-Mail
1391          </div>
1392          <div class="form-line"></div>
1393          <div class="form-info">
1394            
1395              <div class="info-item">
1396                <div class="info-item-desc">
1397                  Order and Shipping questions: 
1398                </div>
1399                <div class="info-item-email">
1400                  <a href="mailto:[email protected]" >
1401                    [email protected]
1402                  </a>
1403                </div>
1404              </div>
1405              
1406              <div class="info-item">
1407                <div class="info-item-desc">
1408                  Tech Support: 
1409                </div>
1410                <div class="info-item-email">
1411                  <a href="mailto:[email protected]" >
1412                    [email protected]
1413                  </a>
1414                </div>
1415              </div>
1416              
1417              <div class="info-item">
1418                <div class="info-item-desc">
1419                  Distribution: 
1420                </div>
1421                <div class="info-item-email">
1422                  <a href="mailto:[email protected]" >
1423                    [email protected]
1424                  </a>
1425                </div>
1426              </div>
1427              
1428              <div class="info-item">
1429                <div class="info-item-desc">
1430                  Project &amp; Customized Service: 
1431                </div>
1432                <div class="info-item-email">
1433                  <a href="/customization-form" >
1434                    Customization Project Inquiry Form
1435                  </a>
1436                </div>
1437              </div>
1438              
1439
1440              <div class="info-address">
1441                <div class="info-address-title">
1442                  Shenzhen Headquarters: 
1443                </div>
1444                <div class="info-address-info">
1445                   Block A10, Expo Bay South Coast, Fuhai Street, Bao&#39;an District, Shenzhen, China
1446                </div>
1447              </div>
1448              <div class="info-tel">
1449                <span class="info-tel-title">
1450                  TEL: 
1451                </span>
1452                <span class="info-tel-info">
1453                  +86 755 8657 5379
1454                </span>
1455              </div>
1456          </div>
1457        </div>
1458        
1459          <div class="form-right">
1460            <div class="form-right-title">
1461              CONTACT US
1462            </div>
1463            <div class="form-tips">
1464              Talk with AI agent before hitting send!😎
1465            </div>
1466            <div class="form-options-wrap">
1467              
1468                <div class="form-option">
1469                  <label for="Sales Inquiry" class="form-option-label">
1470                    <input type="radio" name="option" id="Sales Inquiry" class="form-option-radio" autocomplete="off"
1471                      value="0" checked/>
1472                    <span class="form-option-circle"></span>
1473                    <span>
1474                      Sales Inquiry
1475                    </span>
1476                  </label>
1477                </div>
1478                
1479                <div class="form-option">
1480                  <label for="Business Cooperation" class="form-option-label">
1481                    <input type="radio" name="option" id="Business Cooperation" class="form-option-radio" autocomplete="off"
1482                      value="1" />
1483                    <span class="form-option-circle"></span>
1484                    <span>
1485                      Business Cooperation
1486                    </span>
1487                  </label>
1488                </div>
1489                
1490                <div class="form-option">
1491                  <label for="Tech Support" class="form-option-label">
1492                    <input type="radio" name="option" id="Tech Support" class="form-option-radio" autocomplete="off"
1493                      value="2" />
1494                    <span class="form-option-circle"></span>
1495                    <span>
1496                      Tech Support
1497                    </span>
1498                  </label>
1499                </div>
1500                
1501                <div class="form-option">
1502                  <label for="After-Sales Service" class="form-option-label">
1503                    <input type="radio" name="option" id="After-Sales Service" class="form-option-radio" autocomplete="off"
1504                      value="3" />
1505                    <span class="form-option-circle"></span>
1506                    <span>
1507                      After-Sales Service
1508                    </span>
1509                  </label>
1510                </div>
1511                
1512                <div class="form-option">
1513                  <label for="Media" class="form-option-label">
1514                    <input type="radio" name="option" id="Media" class="form-option-radio" autocomplete="off"
1515                      value="4" />
1516                    <span class="form-option-circle"></span>
1517                    <span>
1518                      Media
1519                    </span>
1520                  </label>
1521                </div>
1522                
1523                <div class="form-option">
1524                  <label for="Others" class="form-option-label">
1525                    <input type="radio" name="option" id="Others" class="form-option-radio" autocomplete="off"
1526                      value="5" />
1527                    <span class="form-option-circle"></span>
1528                    <span>
1529                      Others
1530                    </span>
1531                  </label>
1532                </div>
1533                
1534            </div>
1535            <div class="form-input-wrap">
1536              <div class="form-name">
1537                <input type="text" class="form-input-name" placeholder="NAME:"
1538                  autocomplete="off" />
1539              </div>
1540              <div class="form-email">
1541                <input type="text" class="form-input-email" placeholder="E-MAIL:"
1542                  autocomplete="off" />
1543              </div>
1544              <div class="form-msg">
1545                <textarea class="form-input-msg" placeholder="MESSAGE:"
1546                  autocomplete="off"></textarea>
1547              </div>
1548            </div>
1549            <p class="form-failed-warning">
1550              Failed to submit, please try again!
1551            </p>
1552            <div class="form-submit-btn">
1553              Submit
1554            </div>
1555            <div class="form-success">
1556              <div class="form-success-icon"></div>
1557              <div class="form-success-desc">
1558                 Success! We will reply in 24 hours.
1559              </div>
1560            </div>
1561          </div>
1562    </div>
1563  </div>
1564  <div class="contact-mask">
1565    <div class="mask-msg-box">
1566      <div class="mask-close-btn"></div>
1567      <div class="mask-msg-icon"></div>
1568      <div class="mask-msg-desc">
1569        <p>
1570          Oops! Your name is null.
1571        </p>
1572        <p>
1573          Please adjust and continue.
1574        </p>
1575      </div>
1576      <div class="mask-continue-btn">
1577        Continue to fill in
1578      </div>
1579
1580    </div>
1581  </div>
1582</div>
1583
1584<script>
1585  $(".form-success").hide();
1586  $(".contact-mask").hide();
1587
1588  function showFailedWarning(show) {
1589    $(".form-submit-btn").toggleClass("failed", show);
1590    $(".form-failed-warning").toggle(show);
1591  }
1592
1593  $(".form-submit-btn").click(function (e) {
1594    let optionValue = $("input:radio:checked").val();
1595    let nameValue = $.trim($(".form-input-name").val());
1596    let emailValue = $.trim($(".form-input-email").val());
1597    let msgValue = $.trim($(".form-input-msg").val());
1598
1599    if (!nameValue) {
1600      $(".mask-msg-desc>p:first-of-type").text('Oops! Your name is null.');
1601      $(".contact-mask").show();
1602      return;
1603    }
1604    /* email格式校验 */
1605    if (!/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(emailValue)) {
1606      $(".mask-msg-desc>p:first-of-type").text('Oops! Your email is invalid.');
1607      $(".contact-mask").show();
1608      return;
1609    }
1610    if (!msgValue) {
1611      $(".mask-msg-desc>p:first-of-type").text('Oops! Your message is null.');
1612      $(".contact-mask").show();
1613      return;
1614    }
1615
1616    $.post("https://web-admin.m5stack.com/api/message", { name: nameValue, email: emailValue, message: msgValue, type: optionValue }, function (data) {
1617      if (data.code === 1) {
1618        $("input:radio:first").prop('checked', 'true');
1619        $(".form-input-name").val('');
1620        $(".form-input-email").val('');
1621        $(".form-input-msg").val('');
1622        $(".form-success").show();
1623      } else {
1624        $(".form-submit-btn").addClass("failed");
1625        $(".form-failed-warning").show();
1626      }
1627    });
1628  });
1629  $(".form-input-name").keyup(function (e) {
1630    showFailedWarning(false);
1631  });
1632  $(".form-input-email").keyup(function (e) {
1633    showFailedWarning(false);
1634  });
1635  $(".form-input-msg").keyup(function (e) {
1636    showFailedWarning(false);
1637  });
1638
1639  $(".mask-close-btn").click(function (e) {
1640    $(".contact-mask").hide();
1641  });
1642  $(".mask-continue-btn").click(function (e) {
1643    $(".contact-mask").hide();
1644  });
1645</script>
1645
1646
1647</body>
1648
1649</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.