https://www.thehewittfertilitycentre.org.uk/_frontend/js/main/functions/contact-tabs.js

1var initContactTabs = function () {
2    var $toggleTabsButtons = $('.js-open-contact-panel');
3
4    if ($toggleTabsButtons.length) {
5        // element variables
6
7        $tabs = $('.contact_expand_panel');
8
9        // constant variables
10
11        var activeClass = "active",
12            transitionDuration = 300,
13            panelDataAttribute = 'data-panel',
14            tabIsOpen = false;
15
16        // functions
17
18        var toggleTab = function ($btn, $tab) {
19            $tabs.stop().slideUp(function () {
20                $(this).removeClass(activeClass);
21            });
22
23            $toggleTabsButtons.removeClass(activeClass);
24
25            if (tabIsOpen) {
26                setTimeout(function () {
27                    openTab($btn, $tab);
28                }, 300);
29            } else {
30                openTab($btn, $tab);
31            }
32        };
33
34        var openTab = function ($btn, $tab) {
35            $btn.addClass(activeClass);
36
37            setTimeout(function () {
38
39                $tab.slideDown(function () {
40
41                    var siteHeaderHeight = $('.site_header').outerHeight();
42
43                    $tab.addClass(activeClass);
44                    customResize.resizeEvent();
45                    $("html, body").animate({ scrollTop: $tab.offset().top - siteHeaderHeight });
46                });
47
48
49            }, 150);
50
51            tabIsOpen = true;
52        };
53
54        var closeTab = function ($btn, $tab) {
55            $tab.stop().slideUp(function () {
56                $tab.removeClass(activeClass);
57
58                setTimeout(function () {
59                    $btn.removeClass(activeClass);
60                }, transitionDuration);
61
62                setTimeout(function () {
63                    $tab.hide();
64                }, transitionDuration + 100);
65            });
66        };
67
68        // ui bindings
69        $toggleTabsButtons.on('click', function () {
70            var $btn = $(this),
71                tabId = $btn.attr(panelDataAttribute),
72                $tab = $tabs.filter('[' + panelDataAttribute + '="' + tabId + '"]');
73
74            if ($btn.hasClass(activeClass)) {
75                // scroll the current tab
76                openTab($btn, $tab);
77            } else {
78                // close other tabs and open this one
79                toggleTab($btn, $tab);
80            }
81        });
82
83        //show first tab by default
84        var showFirstTab = function ($btn, $tab) {
85            $btn.addClass(activeClass);
86            $tab.show();
87        }
88
89        showFirstTab($toggleTabsButtons.eq(0), $tabs.filter('[' + panelDataAttribute + '="' + $toggleTabsButtons.eq(0).attr(panelDataAttribute) + '"]'));
90    }
91};