app.js 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. // sticky navbar
  2. window.addEventListener('scroll', function(){
  3. var header = document.querySelector('#navbar');
  4. if(!header.classList.contains('show')) {
  5. header.classList.toggle("sticky", window.scrollY > 200);
  6. }
  7. })
  8. // mobile menu
  9. const navbar = document.querySelector('.navbar');
  10. const mobileToogleBtn = document.querySelector('.mobile-toggle-btn')
  11. if(navbar && mobileToogleBtn) {
  12. mobileToogleBtn.addEventListener('click', () => {
  13. navbar.classList.toggle('show')
  14. })
  15. }
  16. // mobile menu open
  17. // carousel
  18. // job preparation carousel
  19. var jobPreparationSlider = new Swiper('.jobPreparationSlider', {
  20. loop: true,
  21. slidesPerView: 3,
  22. spaceBetween: 24,
  23. loopedSlides: 1,
  24. breakpoints: {
  25. 0: {
  26. slidesPerView: 1,
  27. },
  28. 576: {
  29. slidesPerView: 2,
  30. },
  31. 993: {
  32. slidesPerView: 3,
  33. }
  34. },
  35. navigation: {
  36. nextEl: ".jobPreparationSlider-next",
  37. prevEl: ".jobPreparationSlider-prev",
  38. },
  39. });
  40. // our blog carousel
  41. var ourBlogSlider = new Swiper('.ourBlogSlider', {
  42. loop: true,
  43. slidesPerView: 3,
  44. spaceBetween: 24,
  45. loopedSlides: 1,
  46. breakpoints: {
  47. 0: {
  48. slidesPerView: 1,
  49. },
  50. 576: {
  51. slidesPerView: 2,
  52. },
  53. 993: {
  54. slidesPerView: 4,
  55. }
  56. },
  57. navigation: {
  58. nextEl: ".ourBlogSlider-next",
  59. prevEl: ".ourBlogSlider-prev",
  60. },
  61. });
  62. // on this day carousel
  63. var onThisDay = new Swiper('.onThisDay', {
  64. loop: true,
  65. slidesPerView: 1,
  66. spaceBetween: 40,
  67. loopedSlides: 1,
  68. navigation: {
  69. nextEl: ".onThisDay-next",
  70. prevEl: ".onThisDay-prev",
  71. },
  72. });
  73. // carousel end