index.html 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <!DOCTYPE html>
  2. <html lang="{{ .Site.LanguageCode }}">
  3. {{ partial "head.html" . }}
  4. <body>
  5. <div id="all" style="overflow-x:hidden;">
  6. {{ partial "nav.html" . }}
  7. {{ partial "LP_components/hero.html" . }}
  8. {{ partial "LP_components/use_cases.html" . }}
  9. {{ partial "LP_components/steps.html" . }}
  10. {{ partial "LP_components/features.html" . }}
  11. {{ partial "LP_components/blogs_tab.html" . }}
  12. {{ partial "LP_components/action.html" . }}
  13. {{ partial "LP_components/Footer.html" . }}
  14. </div>
  15. <!-- /#all -->
  16. {{ partial "scripts.html" . }}
  17. <script>
  18. function tabLP () {
  19. console.log('pass');
  20. if(('.m-tabs').length){
  21. // Show the first tab by default
  22. $('.blog-tabs-stage>div').hide();
  23. $('.blog-tabs-stage>div:first').show();
  24. $('.blog-tabs-nav li:first').addClass('blog-tab-active');
  25. // Change tab class and display content
  26. $('.blog-tabs-nav a').on('click', function(event){
  27. event.preventDefault();
  28. $('.blog-tabs-nav li').removeClass('blog-tab-active');
  29. $(this).parent().addClass('blog-tab-active');
  30. $('.blog-tabs-stage>div').hide();
  31. $($(this).attr('href')).show();
  32. });
  33. }
  34. }
  35. tabLP();
  36. function debounce(func, wait = 20, immediate = true) {
  37. var timeout;
  38. return function() {
  39. var context = this, args = arguments;
  40. var later = function() {
  41. timeout = null;
  42. if (!immediate) func.apply(context, args);
  43. };
  44. var callNow = immediate && !timeout;
  45. clearTimeout(timeout);
  46. timeout = setTimeout(later, wait);
  47. if (callNow) func.apply(context, args);
  48. };
  49. };
  50. const featuresBlock = document.querySelectorAll('.features-block');
  51. const featuresRow = document.querySelectorAll('.sec-features .row');
  52. function checkSlide() {
  53. console.log('pass');
  54. featuresRow.forEach((block, i) => {
  55. // half way through the image
  56. const slideInAt = (window.scrollY + window.innerHeight) - block.offsetHeight / 2;
  57. console.log(slideInAt);
  58. console.log(block.offsetTop);
  59. // bottom of the image
  60. const isHalfShown = slideInAt > block.offsetTop;
  61. if (isHalfShown) {
  62. console.log('active');
  63. featuresBlock[i].classList.add('active');
  64. }
  65. });
  66. }
  67. window.addEventListener('scroll', debounce(checkSlide));
  68. $('.navbar-nav .dropdown:nth-of-type(2)').click(function() {
  69. $('html, body').animate({
  70. scrollTop: $("#sec-features").offset().top
  71. }, 1000);
  72. })
  73. </script>
  74. </body>
  75. </html>