broker_sidebar_tab.php 2.93 KB
<?php if ($results) { ?>
    <div id="people_span_mobile" style="display: none" class="people_span" onclick="openNav(event);">
        <div id="people" class="people">
            <img src="<?php bloginfo('template_directory') ?>/images/people.svg" />
        </div>
    </div>
    <div id="people_span" style="display: none" class="people_span" onclick="openNav(event);" onkeydown="event.keyCode == 13 || event.keyCode == 32 ? openNav(event) : null;" tabindex="0">
            <span id="people_label" style="display:none;" class="people_label">
                your support team is ready to help <i class="material-icons">&#xE037;</i>
            </span>
        <div id="people" class="people">
            <img src="<?php bloginfo('template_directory') ?>/images/people.svg" />
        </div>
    </div>
    <script>
        jQuery(document).ready(
            function ($) {
                $("#people_span_mobile").appendTo(".navbar-header");
                $("#people_span").appendTo("#page-header-landing");
                $("#people_span_mobile").delay(200).animate({width: 'toggle'}, 650);
                $("#people_span").delay(200).animate({width: 'toggle'}, 650);
                $("#people_label").delay(1000).animate({height: 'toggle'});
            }
        );
//        function openNav() {
//            jQuery(document).ready(
//                function ($) {
//                    $("#mySidenav").toggleClass('mySidenavOpen');
//                    $(".people_span").toggleClass('peopleOpen');
//                    $("#people_label").toggle();
//                }
//            );
//        }
        /* Set the width of the side navigation to 250px */
        function openNav(event) {
            $("#mySidenav").toggleClass('mySidenavOpen');
            $(".page-header-landing-mySidenav").toggleClass('mySidenavOpen');
            $(".people_span").toggleClass('peopleOpen');
            $("#people_label").toggle();
        }

        jQuery(document).ready(
            function ($) {
                $("#mySidenav").appendTo(".navbar-header");
                $("#people_span_mobile").appendTo(".navbar-header");
                $("#people_span").appendTo("#page-header-landing");
                $("#mySidenav").clone().appendTo("#page-header-landing").addClass('page-header-landing-mySidenav');
                var smallMenu = jQuery('.col-sm-smallMenu');
                // Change zIndex when a user hovers the side menu
                smallMenu.on(
                    'mouseenter', function () {
                        $(this).css('zIndex', 999999);
                    }
                );

                smallMenu.on(
                    'mouseleave', function () {
                        setTimeout(
                            function () {
                                smallMenu.css('zIndex', 0);
                            }, 500
                        );
                    }
                );
            }
        );
    </script>
<?php } ?>