jQuery Visual Bootstrap grid

jQuery-плагин визуализирующий Bootstrap сетку. Совместим с 3-й и 4-й версией фреймворка, поддерживает горячие клавиши.

 

Принцип работы

Скрипт накладывает слой с сеткой в соответствии с настройками вашего фреймворка и помогает при вёрстке с использованием Bootstrap.

 

Установка

Необходимо добавить строку после подключенного jQuery и указать правильный путь к файлу .js:

<script src="путь_к_файлу/jQuery.vbgp.js"></script>

 

Настройка

Настройка скрипта производится в области /* Script settings */

numCols - отвечает за количество колонок (по умолчанию 12)

bootstrapVersion - отвечает за версию Bootstrap (по умолчанию 4)

 

Использование

Управление визуализатором сетки производится посредством наведения курсора мыши в правый верхний угол либо горячими клавишами.

CTRL+; - показать/скрыть сетку

CTRL+' - показать/скрыть межколоночные отступы

CTRL+[ - перекрасить сетку в серые тона/цвет

CTRL+] - показать номера колонок

Посмотреть скрипт в действии можно прямо на этой странице!