CSS-Animations (Collection) 1.0.6
-
the_waiters -
December 19, 2014 at 11:43 AM -
328 Downloads -
11 Comments
This Plugin extent the WoltLab Community Framework 2 with animations.
The following animations are already integrated:
- .AnimationHoverRotateRight
- .AnimationHoverRotateLeft
- .AnimationHoverQuake
- .AnimationHoverScaleDown
- .AnimationHoverScaleUp
- .AnimationBounce
- .AnimationFlash
- .AnimationPulse
- .AnimationRing
- .AnimationShake
to the demo
To give an element an animation, you can:
- give an element the desired class with Javascript.
- customize a template
- call the animation via CSS/less
Javascript-example:
<script>
var element = document.getElementById("gewünschte ID des Elements");
element.classList.add("gewünschte Klasse");
</script>
Further informations:
http://molily.de/js/css.html#addclass
http://www.html-seminar.de/javascript-htm…nte-aendern.htm
Call the animation in the style-settings:
- Example with the animation Pulse
"the desired element" {
.AnimationPulse;
}
- Example of use for the conversation-icon with the animation Pulse when you get a message
#unreadConversations:not([data-count="0"]) > a > span.icon {
.AnimationPulse;
}
further informations:
http://www.mediaevent.de/css/animation.html
http://www.lesscss.de/
Support requests will only be answered in the support area of my website Destinaja.de. Please start your requests there. Thanks.
-
Version 1.0.6
-
the_waiters -
April 1, 2016 at 10:08 AM -
74.75 kB -
173 Downloads
Änderungen (deutsch) https://destinaja.de/news/8-oster-patch-day/
Changes (english) https://destinaja.de/news/7-easter-patch-day/ -
-
Version 1.0.5
-
the_waiters -
April 30, 2015 at 11:06 AM -
73.73 kB -
72 Downloads
-fix a problem with AnimationPulse for Browser Opera, Firefox and Internet Explorer
-add Hover Animation RotateRight (class ".AnimationHoverRotateRight")
-add Hover Animation RotateLeft (class ".AnimationHoverRotateLeft") -
-
Version 1.0.4
-
the_waiters -
April 14, 2015 at 12:28 AM -
29.7 kB -
21 Downloads
-add Hover Animation Quake (class ".AnimationHoverQuake")
-add Hover Animation ScaleUp (class ".AnimationHoverScaleUp")
-add Hover Animation ScaleDown (class ".AnimationHoverScaleDown") -
-
Version 1.0.3
-
the_waiters -
January 30, 2015 at 8:44 AM -
28.67 kB -
34 Downloads
-add Animation Bounce (class ".AnimationBounce")
-add Animation Flash (class ".AnimationFlash")
-add Animation Glow (class ".AnimationGlow")(you need to set the colors with the variables "@wcfAnimationGlowSchadowColor" and "@wcfAnimationGlowSchadowGlowColor" before.)Because of the reducing from x LESS-files to only one LESS-file, you need to reinstall this plugin
-
-
Version 1.0.1
-
the_waiters -
December 30, 2014 at 5:36 PM -
25.6 kB -
26 Downloads
initial release
-Animation Pulse (class ".AnimationPulse")
-Animation Ring (class ".AnimationRing")
-Animation Shake (class ".AnimationShake")
-Animation Tata (class ".AnimationTata") -
