Why is slicknav not showing up on IOS?

Question

css

Tell me, please, has anyone encountered a similar problem when slicknav is not displayed under ios. More precisely, the "button-burger". Under other platforms everything is fine. I can't show the site.

I am not a supporter of plugins at all, but I was given a task to figure out why it does not work. I've been sitting for an hour and I can't understand. Maybe someone with a fresh head will look and immediately find the catch. Thoughts are already coming to completely redesign this adaptive menu.

CSS code:

/* custom menu*/

.slicknav_menu {
    /*position: absolute;*/
    top: 0;
    width: 100%;
    z-index: 100;
    padding: 0;
    overflow-y: auto;
    background: transparent;
}
.slicknav_menu-open .slicknav_menu {
    position: fixed;
    bottom: 0;
}
@media (min-width: 992px) {
    .slicknav_menu {
        display: none;
    }
}
.slicknav_nav {
    padding-top: 70px;
    padding-bottom: 10px;
    background: #3674b4;
}
.slicknav_menu-open {
    overflow: hidden !important;
}

/*.slicknav_btn*/
.slicknav_btn {
    line-height: 1;
    position: fixed;
    z-index: 101;
    top: 15px;
    right: auto;
    bottom: auto;
    left: 15px;
    float: none;
    width: auto;
    margin: 0;
    padding: 8px;
    text-decoration: none;
    border: 1px solid #3674b4;
    border-radius: 0;
    background-color: rgba(255, 255, 255, .6);
    text-shadow: none;
}
.slicknav_menu-open .slicknav_btn {
    border-color: #fff;
    background-color: rgba(54,116,180, .6);
}
.slicknav_menu .slicknav_icon {
    float: none;
    width: 100%;
}
.slicknav_menu .slicknav_icon:before {
    position: absolute;
    display: block;
    width: 30px;
    height: 3px;
    content: '';
    background: transparent;
}
.slicknav_menu .slicknav_icon-bar {
    display: block;
    width: 35px;
    height: 3px;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: #3674b4;
}

JS code:

var slicknavNav = '.slicknav_nav';
        $('.is-mobile .skew_fon').remove();
        $('.is-mobile .head__nav-item > a').unwrap();
        $(".is-mobile .sub__menu-item").replaceWith(function(index, oldHTML){
            return $("<ul>").html(oldHTML);
        });
        $('.is-mobile .head__nav-inner').slicknav({
            prependTo: '.page__header',
           closeOnClick: true,
           allowParentLinks: true,
           // label: 'МЕНЮ',
           label: '',
           nestedParentLinks: false
        });

        var slicknavMenuOpen = 'slicknav_menu-open';
        var body = $('body');
        var slicknav_btn = $('.slicknav_btn');
        slicknav_btn.on('click', function() {
            body.toggleClass(slicknavMenuOpen);
        });
         $(".slicknav_menu").prepend("<div class='slicknav_menu-bar'><div class='slicknav_menu-bar__inner'></div></div>");
        $('.is-mobile .search__box').prependTo('.slicknav_menu-bar__inner');
        $('.is-mobile .search__box').prependTo('.slicknav_menu-bar__inner');
        $('.is-mobile .send__quest').prependTo('.slicknav_menu-bar__inner');
        $('.is-mobile .you__city-area').prependTo('.slicknav_menu-bar__inner');

Answer 1

.slicknav_btn {
    position: fixed;

in safari there were problems with position fixed.
https://stackoverflow.com/questions/22167382/posit...