https://brainsphere.ai/js/pages/sass.js

1/*
2    js of interior
3    --------------------------
4    ** Hide header
5    --------------------------
6    ** Show header
7    --------------------------
8    ** horizontal scroll
9    --------------------------
10    ** Toggle for Pricing
11    --------------------------
12*/
13
14(function ($) {
15  "use strict";
16
17  jQuery(document).on("ready", function () {
18    $(function () {
19      /*-----------------------------
20      Hide header
21    -----------------------------*/
22      // build scene
23      // var scene = new ScrollMagic.Scene({
24      //   triggerElement: "#triggerForm",
25      // })
26      //   // trigger animation by adding a css class
27      //   .setClassToggle("#myNavbar", "hideheader")
28      //   .addIndicators({
29      //     name: "1 - add a class",
30      //   }) // add indicators (requires plugin)
31      //   .addTo(controller);
32
33      /*-----------------------------
34      Show header
35    -----------------------------*/
36      // build scene
37      var scene = new ScrollMagic.Scene({
38        triggerElement: "#triggerTo",
39      })
40        // trigger animation by adding a css class
41        .setClassToggle("#myNavbar", "showheader")
42        .addIndicators({
43          name: "1 - add a class",
44        }) // add indicators (requires plugin)
45        .addTo(controller);
46    });
47
48    /*-----------------------------
49    horizontal scroll
50  -----------------------------*/
51    // init controller
52    var controller = new ScrollMagic.Controller();
53
54    var controller = new ScrollMagic.Controller();
55
56    // define movement of panels
57    var wipeAnimation = new TimelineMax().to("#slideContainer", 1, {
58      x: "-55%",
59    });
60
61    // create scene to pin and link animation
62    new ScrollMagic.Scene({
63      triggerElement: "#pinContainer",
64      triggerHook: "onLeave",
65      duration: "350%",
66    })

67      .setPin("#pinContainer")
68      .setTween(wipeAnimation)
69      .addIndicators()
70      .addTo(controller);
71
72    var horizontal = new ScrollMagic.Scene({
73      offset: 50,
74      duration: 300,
75      // reverse: false
76    })
77
78      // .addIndicators()
79      .addTo(controller);
80
81    /*-----------------------------
82    Toggle for Pricing
83  -----------------------------*/
84    var e = document.getElementById("filt-monthly"),
85      d = document.getElementById("filt-yearly"),
86      t = document.getElementById("switcher"),
87      m = document.getElementById("monthly"),
88      y = document.getElementById("yearly");
89
90    e.addEventListener("click", function () {
91      t.checked = false;
92      e.classList.add("toggler--is-active");
93      d.classList.remove("toggler--is-active");
94      m.classList.remove("hide");
95      y.classList.add("hide");
96    });
97
98    d.addEventListener("click", function () {
99      t.checked = true;
100      d.classList.add("toggler--is-active");
101      e.classList.remove("toggler--is-active");
102      m.classList.add("hide");
103      y.classList.remove("hide");
104    });
105
106    t.addEventListener("click", function () {
107      d.classList.toggle("toggler--is-active");
108      e.classList.toggle("toggler--is-active");
109      m.classList.toggle("hide");
110      y.classList.toggle("hide");
111    });
112  });
113})(jQuery);