Bootstrap grid
This is the Bootstrap grid section of moori Foundation. The first column is sticky, the second is filled with content and the third have the property: "justify-content: space-between"
moorl-column-layout-1|slot-a
moorl-column-layout-1|slot-a
moorl-column-layout-1|slot-a
moorl-column-layout-1|slot-a
moorl-column-layout-1|slot-a
moorl-column-layout-1|slot-a
Element animations
Here you see what kind of animations are possible with moori Foundation. You can configure the animation type, speed and timeout. The animation will run if an element enters the viewport, exists the viewport, the mouse enters it or the page was loaded.
moorl-grid-layout-three|slot-a
moorl-grid-layout-three|slot-b
moorl-grid-layout-three|slot-c
moorl-grid-layout-three|slot-d
Sliders
With moori Foundation you have a full responsive special slider block with multiple elements. Here are two examples.
Responsive blocks
With moori Foundation you can hide or show blocks based on your customers viewport. Just resize your browser to see the change.
moorl-grid-layout-fifteen|slot-a
moorl-grid-layout-fifteen|slot-b
moorl-grid-layout-fifteen|slot-c
moorl-grid-layout-fifteen|slot-d
moorl-grid-layout-fifteen|slot-e
moorl-grid-layout-fifteen|slot-f
moorl-column-layout-1-1-1-1-1|slot-a
moorl-column-layout-1-1-1-1-1|slot-b
moorl-column-layout-1-1-1-1-1|slot-c
moorl-column-layout-1-1-1-1-1|slot-d
moorl-column-layout-1-1-1-1-1|slot-e