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 & 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 & 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&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&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 & 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'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.