Add animation effect to any Jimdo module of your website
How it works
You add the below code to Edit Head of specific page where any module inside of the columns would have FadeInUp effect.
<script type="text/javascript">
//<![CDATA[
jQuery.noConflict();
(function($) {
// Init
$(document).ready(function() {
// wow
wow = new WOW(
{
boxClass: 'j-hgrid',
animateClass: ' animated fadeInUp',
mobile: true,
offset: 100
}
)
wow.init();
});
})(jQuery);
//]]>
</script>
<style>
/* <![CDATA[ */
.j-hgrid{
visibility: hidden;
}
/*]]>*/
</style>
Additional customizations
animatedClass:
animated fadeInUp, animated FadeIn
mobile:
true, false
offset:
100 or any other value
Live example
This is the heading
Phasellus tempus. Praesent metus tellus, elementum eu, semper a, adipiscing nec, purus. Fusce a quam. Praesent venenatis metus at tortor pulvinar varius.
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Phasellus consectetuer vestibulum elit. Sed hendrerit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos.
Nam adipiscing. Donec vitae orci sed dolor rutrum auctor. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Donec id justo.
| bg-primary | |
| bg-primary-light | |
| bg-primary-dark | |
| bg-secondary | |
| bg-secondary-dark |
| body | |
| top-header | |
| header | |
| content |
| background | |
| text color | |
| link color | |
| horizontal line |
| style 1 | |
| style 2 | |
| style 3 |
| social icons | |
| navigation color | |
| subnav background |
| background color | |
| navigation color |
| has-center-nav g-font |
| size-15 weight-400 snip-nav is-uppercase --line01 |
| form-white |
| o-form color-white |
| weight-600 is-uppercase |
| weight-600 is-uppercase |
| weight-600 is-uppercase |
| weight-600 is-uppercase |
Note: All changes made here will be applied to your entire website.
MATRIX THEMES
STAND OUT WITH A PROFESSIONAL JIMDO WEBSITE
Write a comment