Web Component: j-Columns


  • Info
  • HTML
  • JS
  • CSS
  • Meta

j-Columns

The component Columns is a very simple alternative to j-Layout and j-Layout2. With this component you can set columns with 100% height by your needs.

  • jComponent v19|v20

Configuration:

  • parent {String} can contain parent, window or jQuery selector for the closest method (default: window)
  • margin {Number} add margin to height (default: 0)
  • marginlg {Number} adds margin to height for LG display (default: margin)
  • marginmd {Number} adds margin to height for MD display (default: margin)
  • marginsm {Number} adds margin to height for SM display (default: margin)
  • marginxs {Number} adds margin to height for XS display (default: margin)
  • noborder {Boolean} disables border (default: false)
  • fontsize {Boolean} enables percentual font-size according to the size of rows (default: false)

Good to know:

Each column must be wrappend in <section>, try to understand from example.

Attributes:

  • data-size contains a size of section LG,MD,SM,XS --> in pixels or percentage, example: 200,200,200,0 (0 means hidden)
  • section without data-size attribute will be counted from the residual value

Author