Aug 11, 2018
0 0

XML Timeline Animation Banner

Written by


XML Timeline Animation Banner

Before iPhones and iPads, Flash has been the best cost-effective solution in delivering quality animations on the web. But with the increased popularity of iOS devices without flash support, industry slowly switches to open standards. Developers are most addicted to Javascript animation libraries for their animation needs. Unfortunately, most of these libraries still have some restrictions that the XML Timeline Animation Banner would like to address. Check out the features below. It may just be what you're looking for.


1. CSS Animation

This uses the power of JQuery to select DOM Elements and Greensock Animation Platform (GSAP) v12 for the really crazy fast animation and sequencing. You can animate almost any CSS property of DOM elements, including border, color, percentages, opacity, cool transformer like skewX, skewY, scaleX, scaleY, rotation, x and y. There are no predetermined CSS parameters in XML that you must enter. Simply animate the properties you need for one or more DOM items. Here is an example that shows the css animation.

2. Javascript Object Property and Functional Property Tweening

XML Timeline Animation Banner is not only limited to DOM Element animation. It also provides a way to tween object properties. You can target a single object or even more objects using arrays. This amazing feature provides a flexible way to animate graphic objects in a canvas element. Another feature is the ability to tween function-based properties. It will work if you have an object with a function rotation () that gets and sets a value. It can also tween, even if you have features like setRotation () and getRotation ().

3. Advanced timeline sequencing

Timelines allow you to compensate the insertion point, adjust animations at the same start time, or adjust them to each other. You can even set a time that can be added to the start time of each animation. You can even proceed by following the next timelines (timeline within a timeline). You can also have more banners that have separate controls on one page.

4. Cross-browser, PC, Mac, Android and iOS compatible

Using a PC, Mac, Android or iOS device? No problem. As it is written in Javascript, it must work on your devices. Standard CSS properties, including special transformers such as rotation, scaleX, scaleY, scale, skewX, skewY, x, y, transformOrigin will work in all modern browsers, even with a classic browser like Internet Explorer 6. Non-standard CSS properties depend of browser support. So if your browser supports it, it can be animated.

5. Advanced user controls

Users will now have video-like controls (without buffering) when the animation is displayed. Repeat, pause, play or search (time or label) at any time so your users do not need to miss a thing. You can use labels that are precisely selected in the search bar so your users will know when the next set of animation begins. All can be set in XML.

6. Multiple banners on one page

You can set more banners on a page using an XML. Each banner can have its own timeline sequence and controls.

7. An XML, multiple banner sizes

An XML can be reused on different pages that require different banner sizes. This can reduce costs because there is no need to rework the same animation with different banner sizes. This can be achieved by using a combination of% based position and size.

8. Cut your images with ImageSlicer

ImageSlicer uses CSS to easily crop and animate images by simply setting the number of rows and columns in XML. Combined with timeline sequencing, it creates cool image disk transitions.

9. Intelligent Autoplay

Most of the time, you do not need a banner animation to play when it's not visible on the page. With this feature you may be able to stop banner animation when it is not displayed on your page. This saves extra processor overhead especially with mobile devices.

10. DOM Element Event Trades

This helps attach events to DOM items without encoding.

Note: Images are not included in your purchase.


Article Tags:
Article Categories:
ThemeForest best selling themes

Jaeho Park completed a Master in Fine Arts at the Hongik University in 1999, followed by a Master in Photographic Studies at the University of Westminster in 2012. After working for many years as a university professor, designer and curator in South Korea.

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.