Фиксированое меню от bootstrap и панель 1С-Битрикс

Фиксированое меню от bootstrap и панель 1С-Битрикс

1857
06.09.2015

Небольшая функция, которая помогает подружить панель 1С-Битрикс и фиксированное верхнее меню от bootstrap

Вызов приведенной ниже функции спасет от перекрытия типовым фиксированным сверху bootstrap-меню административной панели 1С-Битрикс.

div.navbar.navbar-inverse.navbar-fixed-top - объект с меню
function ForFixedPanel(){
    var PanelContainer = $('#panel').find('#bx-panel').attr('class');
    if(PanelContainer!==undefined){
        if(PanelContainer.indexOf('bx-panel-fixed') + 1) {
            var padding = $('#panel').height();
            $('body').css('padding-top',padding+'px');
            $('.navbar-fixed-top').css('top',$('#panel').height()+'px');
        }
        else {
            var padding = parseInt($('div.navbar.navbar-inverse.navbar-fixed-top').height());
            $('body').css('padding-top',padding+'px');
        }
    } else {
        var padding = parseInt($('div.navbar.navbar-inverse.navbar-fixed-top').height());
        $('body').css('padding-top',padding+'px');
    }

    if(PanelContainer.indexOf('bx-panel-fixed') == -1) {
        var padding = parseInt($('div.navbar.navbar-inverse.navbar-fixed-top').height());
        $('body').css('padding-top',padding+'px');
        $('.navbar-fixed-top').css('top','0');
    }
}

Данная функция проверяет взаимное расположение административной панели и навигационного меню и позицинирует их отнсительно друг друга. Приемр вызова функции:

$(document).ready(function(){
    ForFixedPanel();
    $(document).on('click','#bx-panel-pin, #bx-panel-hider, #bx-panel-expander', function () {
        ForFixedPanel();
    })
});

Сразу после загрузки страницы происходит запуск функции и позиционирование, а при нажатии на фиксирующие элементы на административной панели, происходит повторный запуск данной функции.

Update 2016-05-04. Небольшая доработка функции: автодобавление padding-top к body

function ForFixedPanel(){
            var PanelContainer = $('#panel').find('#bx-panel').attr('class');
            var FixedPanel = $('header .navbar-fixed-top').height();
            if(FixedPanel!==undefined){
                Body.css('padding-top',FixedPanel+10+'px');
            }
            if(PanelContainer!==undefined){
                if(PanelContainer.indexOf('bx-panel-fixed') + 1) {
                    var padding = parseInt($('body').css('padding-top')) + $('#panel').height();
                    $('body').css('padding-top',padding+'px');
                    $('.navbar-fixed-top').css('top',$('#panel').height()+'px');
                }
            }
        }    


Благодарю за внимание! Делитесь вашими замечаниями в комментариях ниже.


P.S. Обращайтесь ко мне за приобретением лицензий и продлений на 1C-Битрикс "Управление сайтом", лицензий на облачную и коробочную версии Битрикс 24 а также за приобретением и внедрением готовых решений на базе 1С-Битрикс от партнеров. За более подробной информацией свяжитесь со мной любым удобным для вас способом


Комментарии

Еще никто не комментировал данную публикацию. Будьте первыми!

Добавить комментарий

captcha

Возврат к списку