carousel.html 3.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <div class="my-4 carousel-wrapper">
  2. <div class="swiper carousel">
  3. <div class="swiper-wrapper">
  4. <div class="swiper-slide">
  5. <a target="_blank"
  6. href="/main-news/警察廣播電台初次ai主播真人建模-與choozmo合作ai影片/">
  7. <div class="wrapper">
  8. <img src="/imgs/home/banner-01.jpg"
  9. alt="choozmo|AI主播|AI|警察廣播電臺|警廣|警廣路況|警廣線上收聽|人工智慧|AI人工智慧|人工智能|AI雙主播|雙主播|虛擬主播|虛擬人|新聞播報">
  10. <div class="video-wrapper">
  11. <iframe id="yt_frame" src="https://www.youtube.com/embed/HgrjL8pTpUY?autoplay=1&mute=1" title="YouTube video player"
  12. frameborder="0"
  13. allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  14. allowfullscreen></iframe>
  15. </div>
  16. </div>
  17. </a>
  18. <div class="frame-item">
  19. <select onchange="setFrame(this)">
  20. <option value="">切換語言</option>
  21. <option value="國語">國語</option>
  22. <option value="臺語">臺語</option>
  23. <option value="英文">英文</option>
  24. <option value="日文">日文</option>
  25. <option value="泰文">泰文</option>
  26. <option value="印尼文">印尼文</option>
  27. <option value="越南文">越南文</option>
  28. <option value="馬來文">馬來文</option>
  29. <option value="原住民語">原住民語(阿美族)</option>
  30. <option value="手語">手語</option>
  31. </select>
  32. </div>
  33. </div>
  34. <div class="swiper-slide">
  35. <a href="/main-news/virtual-production-studio-turnkey-solution/">
  36. <img src="/imgs/home/banner-02.jpg"
  37. alt="Turnkey Solution|Virtual Production Studio|AI Spokesperson|choozmo|AI主播|AI|AI建模|虛擬主播|人工智慧|客製化主播|最新服務|英文AI主播|AI 虛擬主播|生成式 AI技術|Facelandmark|deeplearning">
  38. <!-- <img src="/imgs/home/banner01_mb.webp" alt="Choozmo in 2023CES" class="d-block d-md-none p-4"> -->
  39. </a>
  40. </div>
  41. </div>
  42. </div>
  43. <div class="swiper-button-next d-none d-md-block"></div>
  44. <div class="swiper-button-prev d-none d-md-block"></div>
  45. <div class="swiper-pagination"></div>
  46. </div>
  47. <script>
  48. function setFrame(select) {
  49. let val = select.value;
  50. if (val==="國語"){
  51. $('#yt_frame').attr('src','https://www.youtube.com/embed/HgrjL8pTpUY?autoplay=1&mute=1');
  52. } else if (val==="臺語") {
  53. $('#yt_frame').attr('src','https://www.youtube.com/embed/iub7XwIIKsU?autoplay=1&mute=1');
  54. }else if (val==="英文") {
  55. $('#yt_frame').attr('src','https://www.youtube.com/embed/J0rMl5Aje8E?autoplay=1&mute=1');
  56. }else if (val==="日文") {
  57. $('#yt_frame').attr('src','https://www.youtube.com/embed/STBlnumMtJI?autoplay=1&mute=1');
  58. }else if (val==="泰文") {
  59. $('#yt_frame').attr('src','https://www.youtube.com/embed/IQSNsUpzH4M?autoplay=1&mute=1');
  60. }else if (val==="印尼文") {
  61. $('#yt_frame').attr('src','https://www.youtube.com/embed/moxFwtySJM8?autoplay=1&mute=1');
  62. }else if (val==="越南文") {
  63. $('#yt_frame').attr('src','https://www.youtube.com/embed/QfmlSYbvNsg?autoplay=1&mute=1');
  64. }else if (val==="馬來文") {
  65. $('#yt_frame').attr('src','https://www.youtube.com/embed/7jTyzenud8o?autoplay=1&mute=1');
  66. }else if (val==="原住民語") {
  67. $('#yt_frame').attr('src','https://www.youtube.com/embed/oGEX1P9AF9Y?autoplay=1&mute=1');
  68. }else if (val==="手語") {
  69. $('#yt_frame').attr('src','https://www.youtube.com/embed/ycUAa3iKjhA?autoplay=1&mute=1');
  70. }
  71. }
  72. </script>