Forge

The OutSystems Forge is a repository of reusable, open code modules, connectors, and UI components to help speed up app delivery time.
Not finding the component you need?
14 results for tag 
"animation"
CustomBox Modal Effects
by 
Justin Babel
CustomBox modal effects brings your modals to life. This widget has multiple transitions that can be applied to your modals to add smooth animations to your page.

Component wraps the following: http://dixso.github.io/custombox/
Latest version 
1.2.1  (O11)
Latest release
09 October 2018
Also available for 10, 9.1
animate
 
animation
 
css3
 
Custombox
 
effect
 
Effects
 
jQuery
 
modal
 
transition
 
transitions
 
Lottie Animations
by 
Pedro Oliveira
Lottie is a mobile library for Web, and iOS that parses Adobe After Effects animations exported as json with Bodymovin and renders them natively on mobile! Find more at https://github.com/airbnb/lottie-web
Latest version 
1.0.2  (O11)
Latest release
18 Jan
Also available for 10
animate
 
animation
 
bodymovin
 
lottie
 
ResponsiveTabbedNavigation
by 
Hélio Cardoso
A responsive set of animated tabs for mobile, tablets and desktop.
Latest version 
1.1.0  (O9)
Latest release
19 June 2015
mobile
 
Navigation
 
tab
 
responsive
 
css3
 
animation
 
AnimatedTransition
by 
Hélio Cardoso
An animated transition between pages simulating a loading bar, a CSS powered animation, that replaces the refresh of the page while the content is updated using Ajax.
Latest version 
1.1.0  (O9)
Latest release
19 June 2015
animation
 
transition
 
responsive
 
mobile
 
AnimatedPageTransition
by 
Hélio Cardoso
An ajax powered page transition, with a slide-in content animation triggered by a side tabbed navigation.

Responsive layout for all kinds of screen.
Latest version 
1.0.0  (O9)
Latest release
31 July 2015
ajax
 
animation
 
page template
 
side menu
 
tabbed navigation
 
transition
 
responsive
 
mobile
 
PageScrollEffects
by 
Hélio Cardoso
Library of various page scroll events like scale down, catch, fixed, parallax, opacity and gallery.

All elements are in separate pages and webblocks for ease of use.
Latest version 
1.0.0  (O9)
Latest release
19 June 2015
scaledown
 
catch
 
opacity
 
parallax
 
fixed
 
Gallery
 
page template
 
scroll
 
animated
 
animation
 
Bouncy Navigation
by 
Hélio Cardoso
Full-screen navigation, with floating menu items
Latest version 
2.0.0  (O9)
Latest release
19 June 2015
Menu
 
mobile
 
responsive
 
animation
 
modal
 
Navigation
 
GridItemLayout
by 
Hélio Cardoso
A responsive, magazine-like website layout with a grid item animation effect that happens when opening the content.

A variant of
https://heliocardoso.outsystemscloud.com/AnotherGridItemLayou/HomePage.aspx
Latest version 
1.0.0  (O9)
Latest release
23 June 2015
animation
 
blog
 
grid
 
item
 
magazine
 
mobile
 
responsive
 
Tilt Effect on Hover 3D
by 
Nuno Lopes
Animate an image on your project with a 3d tilt effect by hovering it, with the option to appear a frame and some text
Latest version 
1.0.0  (O10)
Latest release
28 June 2017
3d
 
animation
 
hover
 
image
 
picture
 
tilt
 
web
 
RestaurantMenu
by 
Hélio Cardoso
Applying CSS 3D transforms to components can bring some more realism to normally flat web elements. The idea is to show the menu as a folded flyer and unfold it in order to show the menu items.
Latest version 
1.0.0  (O9)
Latest release
03 July 2015
flyer
 
Menu
 
restaurant
 
animation
 
404 Pages
by 
Pankaj pant
Nicely designed,  The HTTP 404, 404 Not Found and 404 error message using animation, canvas
Latest version 
2.0.0  (O11)
Latest release
17 December 2018
Also available for 10
404
 
errorpage
 
animation
 
FixedBackgroundEffect
by 
Hélio Cardoso
The point is having the same element (in this case a phone) in the exact same position in all background images, so that while you scroll everything moves, but the phone.
Latest version 
1.0.0  (O9)
Latest release
07 May 2015
css3
 
background
 
animation
 
AnimatedBorderMenu
by 
Hélio Cardoso
An off-canvas icon navigation with an animated border effect.
Latest version 
1.0.0  (O9)
Latest release
03 July 2015
animation
 
responsive
 
mobile
 
Menu
 
border
 
AnotherGridItemLayout
by 
Hélio Cardoso
A responsive, magazine-like website layout with a grid item animation effect that happens when opening the content.

A variant of
https://heliocardoso.outsystemscloud.com/GridItemLayout/Home.aspx
Latest version 
1.0.0  (O9)
Latest release
24 June 2015
responsive
 
mobile
 
blog
 
magazine
 
animation
 
grid
 
item