Questions tagged [animation]

Animation is the rapid display of a sequence of visuals in order to create an illusion of movement or change.

Animation is the rapid display of a sequence of visuals in order to create an illusion of movement or change. The elements of animation are typically images or mathematical renderings. Animation effects can be 2D or 3D.

The most common method of presenting animation is as a motion picture or video program, although there are other methods. This type of presentation is usually accomplished with a camera and a projector or a computer viewing screen which can rapidly cycle through images in a sequence. Animation can be made with either hand-rendered art, computer-generated imagery, or three-dimensional objects, e.g., puppets or clay figures, or a combination of techniques. The position of each object in any particular image relates to the position of that object in the previous and following images so that the objects each appear to fluidly move independently of one another. The viewing device displays these images in rapid succession, usually 24, 25, or 30 frames per second.

44523 questions
66
votes
4 answers

Multiple requestAnimationFrame performance

If I’m doing multiple animations, is it OK performance-wise to add multiple requestAnimationFrame callbacks? F.ex: function anim1() { // animate element 1 } function anim2() { // animate element 2 } function anim3() { // animate…
David Hellsing
  • 106,495
  • 44
  • 176
  • 212
65
votes
5 answers

How to achieve right to left animation to start the activity

I am working on one demo application where I want to apply animation whenever app start any activity. I wrote below code but this is for to animate the activity from left to right. left_to_right.xml
N Sharma
  • 33,489
  • 95
  • 256
  • 444
65
votes
6 answers

addSubview animation

I have main UIView where I display different data. Then I put a button, which displays subview like this: - (IBAction) buttonClicked:(id)sender { UIView *newView = [[UIView alloc] initWithFrame:CGRectMake(25,25,50,20)]; UILabel *newLabel =…
Mike
  • 1,712
  • 3
  • 17
  • 17
64
votes
8 answers

Wpf animate background color

I need help in taking right decision. I need to animate a background color of my user control when some event happens. When it is, I want to change the background just for 1 second and then turn it back. Which way should I go? Use color animation or…
Taras
  • 1,118
  • 2
  • 12
  • 19
63
votes
2 answers

Simple animation using C#/Windows Forms

I need to knock out a quick animation in C#/Windows Forms for a Halloween display. Just some 2D shapes moving about on a solid background. Since this is just a quick one-off project I really don't want to install and learn an entire new set of…
Clinton Pierce
  • 12,859
  • 15
  • 62
  • 90
62
votes
8 answers

Dot dotdot dotdotdot as loading?

I wanna create some loading dots, like this: At 0000 miliseconds the span content is: . At 0100 miliseconds the span content is: .. At 0200 miliseconds the span content is: ... In a loop. What is the best / easiest way to make it?
Thew
  • 15,789
  • 18
  • 59
  • 100
62
votes
3 answers

How many milliseconds do "slow", "normal", and "fast" represent in jQuery?

jQuery allows use of the string values "slow", "normal", and "fast" in animations (e.g.: $('#example').fadeOut('slow');). How many milliseconds do each of these values represent?
Matt Huggins
  • 81,398
  • 36
  • 149
  • 218
62
votes
3 answers

How to draw a circle with animation in android with circle size based on a value

I want to develop a custom component which draws part of the circle based on different values. e.g draw 1/4 cirle, 1/2 circle etc. The component needs to be animated to display drawing process. The partial circle is drawn on top of a static…
Leon Li
  • 1,183
  • 2
  • 13
  • 14
61
votes
5 answers

What is an easing function?

What is meant by easing function in the context of animation. It seems that dojo, jquery, silverlight, flex and other UI systems have the notion of easing function. I could not locate a good explanation of easing functions? Can anyone explain the…
ams
  • 60,316
  • 68
  • 200
  • 288
61
votes
5 answers

How to pause and resume CSS3 animation using JavaScript?

I've tried to google and look from this forum a solution for my problem but no luck so far. I would like to pause my CSS3 animation (image slide show) by clicking a picture and also resume to the same animation by clicking a picture. I know how to…
nqw1
  • 979
  • 3
  • 11
  • 16
61
votes
2 answers

How to create a pulse effect using -webkit-animation - outward rings

I have found this article: http://www.zurb.com/article/221/css3-animation-will-rock-your-world on css3 animations. I am trying to create a similar effect seen on the site above but on personal site at: www.imfrom.me Where I have the state of…
user39980
61
votes
6 answers

Slidedown and slideup layout with animation

how can I display a layout in the center with slideUp when I press the button, and press again to hide ... slideDown in ANDROID help me with that, thnkss
EliasM
  • 737
  • 1
  • 6
  • 14
60
votes
12 answers

How to disable CALayer implicit animations?

It's driving me crazy! I am working on a drawing application. Let's say I am working on a UIView called sheet. I am adding some sublayers to this view ([sheet.layer addSublayer:...]) and then I want to draw into them. To do so I am creating a…
Esepher
  • 641
  • 1
  • 5
  • 4
60
votes
4 answers

Performance of CSS Transitions vs. JS animation packages

I'm wondering is there any difference in performance of using CSS Transitions vs. any of the various JavaScript animation libraries? (script.aculo.us, scripty2, jsAnim, MooTools, $fx, etc). I've tried various tests in Safari and Chrome but I don't…
desau
  • 3,001
  • 1
  • 24
  • 27
59
votes
7 answers

requestAnimationFrame with this keyword

I'm using webkitRequestAnimationFrame but I'm having trouble using it inside of an object. If I pass the this keyword it will use window and I can't find a way for it to use the specified object instead. Example: Display.prototype.draw =…
Ryan
  • 3,726
  • 3
  • 26
  • 38