Отключить липкую боковую панель при адаптивном просмотре - PullRequest
Новая
       22

Отключить липкую боковую панель при адаптивном просмотре

0 голосов
/ 02 июля 2018

из самого названия. Я хочу отключить липкую боковую панель во время мобильного просмотра / адаптивного просмотра. В настоящее время я могу создать плавающую боковую панель, добавив этот код JQUERY. HTML 

<div  class="sidebar col-md-4">
    <div class="">
        <div class="widget">
            <div class="total-payment">PHP 2,500.00</div>
            <ul class="list-icon list-icon-orange">
                <li><i class="fa fa-calendar info-icon"></i><span class="info-label">Earliest available date: 14 Jun 2018</span></li>
                <li><i class="fa fa-hourglass-2 info-icon"></i><span class="info-label">48 Hours Confirmation</span></li>
                <li><i class="fa fa-flag-o info-icon"></i><span class="info-label">Join Group</span></li>
            </ul>
            <p class="info-p">
                Fill up this form and received a confirmation within 24 hours. LAST MINUTE BOOKING for next day must be made on or before 3:00PM.
            </p>
            <div class="row">
                <div class="col-md-12">
                    <div class="form-group text-center">
                         <button type="button" class="btn btn-block btn-orange" style="font-size:24px;">Book</button>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>

Jquery 

$(function() {
            var $sidebar   = $(".sidebar"), 
                $window    = $(window),
                offset     = $sidebar.offset(),
                topPadding = 115;
            $window.scroll(function() {
                if ($window.scrollTop() > offset.top) {
                    $sidebar.stop().animate({
                        marginTop: $window.scrollTop() - offset.top + topPadding
                    });
                } else {
                    $sidebar.stop().animate({
                        marginTop: 0
                    });
                }
            });

        });

Он отлично работает на большом разрешении, но я просто не могу отключить его во время просмотра с мобильных устройств. любая помощь будет оценена. Спасибо

1 Ответ

0 голосов
/ 04 июля 2018

Итак, основываясь на предложении, мне удалось исправить это с помощью некоторых операторов if, и это помогло:) 

var isMobile = false;

if ( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
    isMobile = true;
}

if (isMobile != true) {
    $(function() {
        var $sidebar   = $("#sticky"), 
            $window    = $(window),
            offset     = $sidebar.offset(),
            topPadding = 115;
        $window.scroll(function() {
            if ($window.scrollTop() > offset.top) {
                $sidebar.stop().animate({
                    marginTop: $window.scrollTop() - offset.top + topPadding
                });
            } else {
                $sidebar.stop().animate({
                    marginTop: 0
                });
            }
        });
    });
}
...