The Stack Overflow podcast is back! Listen to an interview with our new CEO.

Questions tagged [animation]

For questions related to graphical animations. This includes, but is not limited to sliding, tweening, rotating and resizing of shapes.

Filter by
Sorted by
Tagged with
15
votes
1answer
33k views

Alternative to setInterval and setTimeout

JavaScript's setTimeout() and setInterval() are evil and not precise: Both functions have a delay of a varying quantity of ...
3
votes
1answer
134 views

Single Rotate Method

I just started coding a simulation-like application. It's about our solar system. Right now, I'm working on rotating the moon. I have this constructor ...
5
votes
1answer
115 views

Game sprite animation

This code animates my main game sprite by increasing the animation frame. First I check if the character is moving, then I increase the animation counter until it reaches the desired speed, and then ...
1
vote
1answer
149 views

Eliminate nested HTML elements for jQuery animation?

Background When a user leaves a page, if they haven't submitted form data, a button is animated to draw the user's attention. (This is a poor UX choice--all the form data should be submitted--but it ...
7
votes
2answers
298 views

Cleaning up and commenting on my code for Pong game

This post is a follow-up to Simple Pong game I took the some advice from the previous post and I'm almost done with cleaning up the code. I didn't make any wrapper classes, because my game is already ...
11
votes
1answer
1k views

Simple Pong game

I'm writing a simple Pong game. I have a method bounce() that makes everything run: the ball, the paddles, score etc. and it uses 12 arguments: 3 counters, 2 ...
7
votes
1answer
2k views

Optimizing very simple piece of “Game of Life” code by taking advantage of NumPy's functionality

Here is the code as it stands right now: ...
16
votes
2answers
1k views

Sprite animation handler

When a user presses a key in my game, their avatar can move down, left, right or up. By move, I mean their avatar animates while various other things move around them on the screen. This is ...
5
votes
1answer
8k views

Bouncing ball in JavaScript

I have been using this code for a while for a project at work. Actually I got it from a friends who got it from a book. But either way it worked for my demonstration. But the other night I decided to ...
2
votes
1answer
1k views

Best way to refactor this loop of animations with delay?

I have some animations happening after some delay calls the code to animate. It works fine, but the code to call the functions is not nice. ...
3
votes
1answer
330 views

Small animation with Raphael

I have a small animation with Raphael using a large amount of code. Is there any way to reduce it? Demo ...
3
votes
1answer
131 views

Animating based on screen width

Depending on the width of the screen the JavaScript animates a node and then loops another animation. I'm trying to understand DRY but my JavaScript skills aren't quite up to scratch to get this code ...
7
votes
4answers
2k views

Animated scrolling when intra-page links are clicked

I have the following code to get the ID of a <a href="#ID"> </ a> and go to their respective div <div id="" />:...
4
votes
4answers
163 views

Animated scrolling to a place in the same webpage

I'm just beginning web design, and I've come up with this code to scroll to a place in the same page. I don't know if this can or should be improved much longer, so I'm asking for any tips that can ...
3
votes
2answers
2k views

Text revelation effect

I would be glad if someone could take a look at my code and maybe improve it. It's an animation effect to gradually reveal text as if it were being decoded. I wouldn't mind if it could run with jQuery ...
2
votes
2answers
238 views

Window-size-dependent navigation menu with animation effects

Other people will be looking at this jquery code and i'm not an expert with jQuery so im asking. How can i make this jQuery code shorter, more efficient, and easier to read? ...
1
vote
1answer
3k views

Tinder-esque location pulse animation effect

As shameful as it is to say I wanted to see what all the fuss about was with Tinder, but after downloading it I found I was more interested with its animation effects and started wondering how they ...
1
vote
2answers
107 views

Various animation functions

I been learning web development for 1.5 month now, and I am trying to improve my code. I can achieve what I want, but I think my code is really bad. For example, I have a bunch of jQuery animations ...
7
votes
2answers
1k views

Sprite animation for a game

I'm just getting started with XNA and game development in general. I followed these instructions to create a basic game, then this article to get sprite animations working. Now, I'm trying to ...
2
votes
4answers
257 views

Using visual themes in a game

In my small application, I need to use a variety of visual themes. The simplified structure of this class: ...
2
votes
3answers
135 views

Animating the opacity of certain page elements

I wrote this jQuery code to animate the opacity (sort of Fadein) of certain elements on my page in consecutive order. It feels very inelegant, though. ...
23
votes
5answers
84k views

Simple Java animation with Swing

I am learning to use Java Swing and have made a simple animation that makes a small shape bounce around the predetermined borders of a panel. The program works well, but I am looking for feedback in ...
2
votes
2answers
7k views

Animation with 5x5 map of cubes

I am trying to learn how to animate with tkinter. The code below is an example I was able to build. It creates a small 5x5 map of cubes, then one of them randomly moves around the screen (preferably ...
4
votes
2answers
1k views

Is this the correct approach to animation in Java?

I was fiddling with animation in Java and wrote this: ...
2
votes
1answer
5k views

Scrolling, fade-in, and fade-out effects feeling clunky

I'm coming close to finishing a site where there are a number of jQuery functions going on. They all work, but the page is just running a bit too clunky. The fading in and out is just not as smooth as ...
2
votes
1answer
1k views

Timeline animations

I recently made this campus timeline for my university. When viewing the timeline on a mobile device (not a tablet), the navbar changes so that you can jump to the previous or next decade by clicking ...
2
votes
1answer
241 views

Animation for collapsing/expanding a navigation bar

I wrote the following to create an animation which collapses a navigation bar, load new content for it and expands it again. Meanwhile, the rest of the page content fades out, loads and fades in again....
2
votes
1answer
113 views

jQuery eye candy for a WordPress site

This is a follow-up to this question my code has evolved since so I'm reposting my question. What is the best way to tidy this up? How can this be refined? I am finding it's thrashing the layout ...
3
votes
3answers
583 views

jQuery animation and rotation effects for a WordPress site

What is the best way to tidy up JavaScript code I have written? It seems very long winded, any suggestions to shorten it? Note: I'm running it on Wordpress which runs jQuery in nonconflict mode, ...
4
votes
2answers
153 views

Simple element slider animation tool

I'm new to jQuery and I've been messing about with this code, It works but I want to learn how to shorten the code by the eliminating unnecessary repeated code. Here is a link to JSFiddle HTML <...
5
votes
1answer
241 views

Retrocomputing scanline function

I need to refactor this code, targeted to Google Chrome (current+) to make it manageable going forward. Here is a working JSBin of the idea. The messiness comes from determining the accurate number ...
1
vote
1answer
417 views

Website with images that pan to different sides

I've just started programming with JavaScript and I am currently working on this hobby website project of mine. The site is supposed to display pages filled with product images than can be "panned" to ...
1
vote
2answers
387 views

Toggling animations

In the following piece of code I use the same trick three times. But cannot figure out how to write a common function that will do it for all of them. I know there is a toggle method in jQuery that ...
2
votes
3answers
263 views

Animating rotations using jQuery

I am writing a function for a rotating navigation with JS and jQuery. I am using a plugin called jQuery transit for animating rotation. The code works, but it is very long for such a simple function. ...
7
votes
1answer
167 views

Upgrading animation code

I understand that this animation code is outdated: ...
4
votes
2answers
3k views

Animating opacity of 1400 Raphael.js objects hurts animating performance

I am animating 1400 objects trying to create a 'twinkling effect'. As the user moves the mouse faster more hexagon shapes pop into full opacity and have varying fade out rates. The version in the ...
2
votes
2answers
120 views

An “Add” button that clones an item, and a “Remove” button that fades and removes an item

I was looking into removing multiple inputs and selects at once using jQuery, but I couldn't find a solution, so I ended up with the following code: ...
2
votes
2answers
543 views

CSS3 animations of a turntable

I have the following code, which acts like a turntable and plays Sgt. Pepper when you load the page. This works only in Safari (I suppose I can delete the FF parts then), so I'm wondering how I can ...
1
vote
1answer
221 views

Animation effects for menu items

I have pieced together some code that works for my project. However, it is pretty long, but self-similar. I am a jQuery beginner and I tried to shorten the code by using variables, but it didn't work ...
6
votes
3answers
1k views

“Group” animation events in jQuery

I have a number of jQuery animation effects applied to certain elements on the page: ...
0
votes
2answers
294 views

Two icon animations — one on the left, one on the right

I have two icon animations that pretty much do the same thing, the only difference between them is positioning... one is left and the other right. I would like to use one block of code for both left ...
15
votes
3answers
799 views

Sample game code for applying to a development firm

I am contemplating working with a development firm, and had asked for this piece of sample code. Could you please take a look and let me know if this is a quality piece of work, or if it needs ...
1
vote
1answer
244 views

Sequential animations

This is all about a whole lot of animations which should happen sequentially. That's why I am using promise().done() functions. In the end I'm binding a function to ...
1
vote
1answer
249 views

Fade-in / fade-out effects for several buttons

The function of this code is to show/hide divs by way of fadeIn/fadeOut, starting with an empty div (home) and fading in one of the other divs (work,cms,contact,) on click, then fading out the last ...
3
votes
2answers
197 views

Expandable text boxes for legends of fieldsets

What is the best way to refactor the following script? ...
3
votes
2answers
142 views

Periodically sliding images

I wrote this code using jQuery, but I think it can be improved. Can you provide some feedback? ...
4
votes
1answer
636 views

Carousel for website

I have been building my own carousel over the past few days. I am not a jQuery guru, just an enthusiast, and I think my code is a little sloppy, hence the post. Basically what happens is: If someone ...
10
votes
2answers
643 views

Is there a better way to write this jQuery UI effect animation?

I'm writing some code to perform some simple form validation and I would like to display error messages inside the actual relevant textarea by means of a text fadeout/fadein effect. To achieve this I ...
13
votes
2answers
71k views

Fade-in and fade-out in pure JavaScript

I decided to build my own fade-in fade-out function, since that is all I need on my page. Please comment on things I can make better. ...
14
votes
5answers
984 views

Animating one of three boxes based on a form value

Is there a better way to do this without using if or case statements? ...