j-ViewBox
- keeps a fixed percentage height
- great usage for intranet applications
- supports
releasing
Configuration:
height {Number}a percentage of heightdisabled {Boolean}optional, can disable content with the layerparent {String}optional, a container with fixed height, can bewindow. Default value:parentelement.minheight {Number}a minimal height in pixels (default:0- disabled)scroll {Boolean}enables vertical scrolling (default:false- disabled)scrollbar {Boolean/String}shows scrollbar (default:trueor new:native)delay {Number}msec.resizes the box again if the value is changed according to the path (default:100)visibleY {Boolean}still shows theYscrollbar (default:false)visibleX {Boolean}still shows theXscrollbar (default:false)scrollto {String}scrolls to top/bottom automatically if thepathis changed (default:EMPTY, can betoporbottom)margin {Number}optional, a top/bottom margin together (supportsautowhich is counted fromoffset.top, default:0)marginxs {Number}optional, a top/bottom margin together forxsscreen widthmarginsmoptional, a top/bottom margin together forsmscreen widthmarginmdoptional, a top/bottom margin together formdscreen widthmarginlgoptional, a top/bottom margin together forlgscreen widthinvisible {Boolean}iftruethen viewbox setsinvisibleclass when is rendering (default:true)scrollbarshadow {Boolean}iftruethen the custom scrollbars will contain vertical shadow (default:false)initdelay {Number}removes theinivisibleclass after specified time (default:250ms)centered {Boolean}enables vertical and horitonzal centering for the content (default:false)resizedelay {Number}delay for resizing (default:200)- NEW:
togglescrolled {String}a DOM selector for the parent elements (it appendsui-viewbox-scrolledclass when the viewbox is scrolled)
Methods:
component.scrolltop(val)scrolls Ycomponent.scrollbottom(val)scrolls Y from bottom sidecomponent.resize()resizes the container (it reacts onresizeevents automatically)component.resizescrollbar()resizes custom scrollbar (targeted for special cases)
Use it with <ui-component name="viewbox">. When the component is not loaded yet, jComponent downloads it on first use from the address in DEF.fallback (the Componentator CDN by default). Author: Peter Širka. Source: the Componentator components repository, MIT license.
<ui-component name="viewbox" config="height:30;parent:window" style="background-color:#F5F5F5">
Always 30%
</ui-component>
<ui-component name="viewbox" config="height:70;parent:window" style="background-color:#E0E0E0">
Always 70%
</ui-component>