index.html 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. <!DOCTYPE html>
  2. <html lang="{{ .Site.LanguageCode }}">
  3. {{ partial "components/head.html" . }}
  4. <!-- Start of HubSpot Embed Code -->
  5. <script type="text/javascript" id="hs-script-loader" async defer src="//js-na1.hs-scripts.com/20485755.js"></script>
  6. <!-- End of HubSpot Embed Code -->
  7. <body>
  8. <div id="all" style="overflow: hidden;">
  9. {{ partial "components/nav.html" . }}
  10. <div id="home">
  11. {{ partial "components/carousel.html" . }}
  12. {{ partial "components/main.html" . }}
  13. {{ partial "components/serve.html" . }}
  14. {{ partial "components/ai-video.html" . }}
  15. {{ partial "components/progress.html" . }}
  16. {{ partial "LP_components/blogs_tab.html" . }}
  17. {{ partial "LP_components/action.html" . }}
  18. {{ partial "footer.html" . }}
  19. </div>
  20. <!-- {{ partial "nav.html" . }}
  21. {{ partial "LP_components/hero.html" . }}
  22. {{ partial "LP_components/video.html" . }}
  23. {{ partial "LP_components/use_cases.html" . }}
  24. {{ partial "LP_components/steps.html" . }}
  25. {{ partial "LP_components/features.html" . }}
  26. {{ partial "LP_components/blogs_tab.html" . }}
  27. {{ partial "LP_components/action.html" . }}
  28. {{ partial "LP_components/Footer.html" . }}
  29. {{ partial "LP_components/news.html" . }} -->
  30. </div>
  31. <!-- /#all -->
  32. {{ partial "components/scripts.html" . }}
  33. <script>
  34. function tabLP() {
  35. if (('.m-tabs').length) {
  36. // Show the first tab by default
  37. $('.blog-tabs-stage>div').hide();
  38. $('.blog-tabs-stage>div:first').show();
  39. $('.blog-tabs-nav li:first').addClass('blog-tab-active');
  40. // Change tab class and display content
  41. $('.blog-tabs-nav a').on('click', function (event) {
  42. event.preventDefault();
  43. $('.blog-tabs-nav li').removeClass('blog-tab-active');
  44. $(this).parent().addClass('blog-tab-active');
  45. $('.blog-tabs-stage>div').hide();
  46. $($(this).attr('href')).show();
  47. });
  48. }
  49. }
  50. tabLP();
  51. function debounce(func, wait = 20, immediate = true) {
  52. var timeout;
  53. return function () {
  54. var context = this, args = arguments;
  55. var later = function () {
  56. timeout = null;
  57. if (!immediate) func.apply(context, args);
  58. };
  59. var callNow = immediate && !timeout;
  60. clearTimeout(timeout);
  61. timeout = setTimeout(later, wait);
  62. if (callNow) func.apply(context, args);
  63. };
  64. };
  65. const featuresBlock = document.querySelectorAll('.features-block');
  66. const featuresRow = document.querySelectorAll('.sec-features .row');
  67. function checkSlide() {
  68. featuresRow.forEach((block, i) => {
  69. // half way through the image
  70. const slideInAt = (window.scrollY + window.innerHeight) - block.offsetHeight / 2;
  71. // bottom of the image
  72. const isHalfShown = slideInAt > block.offsetTop;
  73. if (isHalfShown) {
  74. console.log('active');
  75. featuresBlock[i].classList.add('active');
  76. }
  77. });
  78. }
  79. window.addEventListener('scroll', debounce(checkSlide));
  80. $('.navbar-nav .dropdown:nth-of-type(2)').click(function () {
  81. $('html, body').animate({
  82. scrollTop: $("#sec-features").offset().top
  83. }, 1000);
  84. })
  85. var swiper = new Swiper(".carousel", {
  86. pagination: {
  87. el: ".swiper-pagination",
  88. clickable: true,
  89. },
  90. });
  91. </script>
  92. <!-- 進度條 -->
  93. <script src="../js/progress.js"></script>
  94. </body>
  95. </html>