We’re rewarding the question askers & reputations are being recalculated! Read more.

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
3
votes
2answers
93 views

SRT caption support for HTML5's video element

With HTML5 you can add captions to your video using the <track /> element. However, only vtt files are officialy supported, while the current most populair ...
9
votes
1answer
3k views

Flipbook type animation with Tkinter

I am writing a program in Python that takes a folder of images and animates them. For example, going through a list of pictures like this and animating them one by one: Relevant features include: ...
4
votes
1answer
57 views

Analyzing spoke overlaps during rotation: Round 2

Round 1: Analyzing spoke overlaps during rotation I previously posted this question, but I've changed a lot of the code since then. There was a mention of the previous being a bit mixed up, and ...
6
votes
1answer
58 views

Analyzing spoke overlaps during rotation

For a personal project that I've recently started I have to analyze the rotation of two shapes with sets of spokes, where the spokes are evenly-spaced, and split into a given number. That is, if I ...
3
votes
0answers
24 views

Sparking animation for Button

I just came through a GitHub repo, which has an amazing animation for Button in Android. So, I though why not make that for web buttons too. And I started ...
1
vote
0answers
135 views

Snake animation in Swing

I'm developing a simple Snake game in Java using Swing. So far I made the snake animation which is troubling me: when the snakes moves it seems like it starts to lag for no reason, but when I move it ...
1
vote
1answer
238 views

jQuery Slideshow with pagination

The code below is for a slideshow that shows a slide with class active, pre-loads a slide with class next, and holds the slide with class last in the background. My biggest issue with this is there ...
5
votes
2answers
202 views

AI to avoid obstacle

The AI I'm making is really simple, however it might be a bit too inefficient for what it is doing. The chart below shows speed differences between various arithmetic and math operations. ...
6
votes
2answers
193 views

2D falling snow animation

I was hoping that someone could review this code. My main concern is that the contents of main() are difficult to read. I thought about extracting some segments of code into functions (to aid ...
1
vote
0answers
107 views

Animated Button on Android using AfterEffects and Lottie

I have a question about my implementation of a "special" Next-Button. First I want to show you my AfterEffects file: So This Animation has 3 parts Green: Entry correct Red: Entry incorrect Blue: ...
4
votes
1answer
83 views

Sierpinski’s Gasket Triangle in JavaScript

I wrote the Sierpinski’s Gasket Triangle in JavaScript, but I feel the code can be better, especially from L32 to L47. Could you make it more organized? ...
0
votes
2answers
61 views

Simple cube that moves around the container with keys

I made a basic cube that can move around of container and jump too. It's basic but I want to know if I can use better methods, better formatting, or shorten the code. This my HTML: ...
1
vote
2answers
67 views

Wireframe animation on canvas is slow

I'm recently working on a project that involves animation in the background. It works well on desktop but performance drops drastically on mobile. I'm using Paper.js to import a svg and animate it. ...
2
votes
0answers
55 views

Excel VBA animation runs slowly after editing worksheet

My VBA macro displays an animation based on a row-by-row time step simulation in the worksheet. The user enters the desired inputs and the worksheet calculates the evolution of the simulation in a ...
5
votes
1answer
308 views

Rendering explosion of bouncing balls on a canvas

I'm making a particle engine that can spawn new explosions while keeping particles from previous ones active (until they despawn). The code works well on its own but within the game, two or more ...
2
votes
2answers
83 views

Looping text with directional control

The code is an implementation of looping text (similar to a circular buffer - wraps around when it reaches the edge of the defined bounds) with directional control. The code is functional and works ...
2
votes
1answer
40 views

Looping text in Python with directional control

The code is an implementation of looping text (similar to a circular buffer - wraps around when it reaches the edge of the defined bounds) with directional control. The code is functional and works ...
5
votes
1answer
151 views

Animating a screw made up of elements

I am working on code to generate a screw made up of different elements and animating it by rotatation. The elements are so called conveying elements (denoted by GFA)...
2
votes
1answer
3k views

A simple analog clock using FLTK

I'm implementing a graphical representation of an "analog clock" with moving hands (seconds, minutes and hours), using mainly2 FLTK facilities and the function ...
3
votes
1answer
288 views

TypeWriter Javascript effect

I have implemented a Javascript TypeWriter effect for my website. It types out code using the TypeWriter variable by adding each character on and setting a timeout. It then 'deletes' code using text ...
1
vote
1answer
65 views

Continuously update position of div with click event

I am trying to continuously get the position of a div on screen and update the new position each time a "click" event listener is clicked. At the moment my code works but feels redundant and could be ...
1
vote
1answer
39 views

Creating smooth animations using rAF

It is my first time trying to create smooth animations using rAF and I would like some insight from more experienced developers. Basically I have 16 elements with x,y coordinates and on mousemove over ...
1
vote
0answers
100 views

Looping over an array with requestAnimationFrame

Over on SO I posted a question: Change transition duration during loop with requestAnimationFrame which hasn't got any responses just yet. I've since come up with this idea and wanted to know if there ...
8
votes
1answer
366 views

Animation of linear transformations

Coordinates Given a 2d space, we can fix a coordinate system to talk about transformations numerically. The red vector, that ends at (1, 0) and the green vector that ends at (0, 1) are called the ...
3
votes
2answers
71 views

Changing the width of a centered progress bar

I am making a game in which the player has a certain amount of available boost. To show this, I am using a blue bar inside a black frame. The bar can grow and shrink at different rates as available ...
2
votes
1answer
356 views

CSS/JS slider using just data-attributes and transform:translate

I needed to make a multi-page form, with slides, but without using too much js code like slick.js or the likes. So I tried to figure out how to make it really simple, but still cross-browser and ...
3
votes
1answer
80 views

JavaScript flipping clock

Here are two simple classes - Digit class maintains digit behaviour - primarily flipping animations, and Clock class handles everything that is related to time data. I'm going to use this code for ...
11
votes
4answers
2k views

Countdown control with arc animation

I've implemented countdown timer control with arc animation that looks like this Implementation notes: For arc visualization I've created class Arc derived from <...
3
votes
1answer
76 views

JavaScript code to add buttons and slowly remove them

My javascript code is working, however i am seeking suggestions on how I can go about improving my existing code for reusability and testability. The code is pretty straight forward, I have three ...
3
votes
0answers
673 views

React native circular progress view

This is a functional component that I have developed in React Native for creating a circular progress view. The code does not use any external libraries, just pure CSS. Article that I wrote while ...
1
vote
0answers
26 views

Cleanly preventing flashing an element from corrupting future flashes

For a Seesaw (Swing) app I'm writing, I need to be able to flash a component for a certain duration. Here's the basic function I came up with that accomplishes this: ...
2
votes
0answers
853 views

React Animation example - accordion panel

I decided to study an animation in React and created a simple example of an collapsible panel using CSSTransitionGroup. To make an animated collapsible, I added max-height: 0, overflow: hidden and a ...
7
votes
1answer
270 views

Time delay indication bar for a text game

For a game I am writing in Python 3.6.5, I made a text-based animation to indicate the passage of time (when chopping a tree or mining a rock, etc). I did a lot of trial and error to get the output ...
2
votes
0answers
49 views

Iterate through images really fast with JS

My objective is to modify the JavaScript code to get the single image on the page to iterate through images faster. It should be possible to get the images to load in about 10 seconds(about 3 seconds ...
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 ...
-2
votes
1answer
84 views

jquery navigation plug-in to show content [closed]

I'm somewhat new to JavaScript / jQuery. I wrote this "plug-in", and it seems to do what I want. But I know what I've done is a bit clunky and inelegant. The idea is that I have multiple columns of ...
3
votes
1answer
701 views

Analog clock in React.js, rendered using CSS rotation

I am new to ReactJS and I am trying to write a component which emulates an analog clock. The second, minutes and hour div elements are transformed every second using an interval function. However, I ...
2
votes
1answer
53 views

A simple program that animates the Y position of multiple elements based on the window scroll position

The following code animates an item's Y position based on how much of its parent is currently visible. This is the first time I ever animated something on JavaScript based on the window scroll ...
1
vote
0answers
1k views

jQuery animate() and css() not performing well in firefox and internet explorer

I am making a webapp that needs a division to expand on click. (The division is loaded with content, so it was likely to not animate very well, but I increased the animation time to 1s to make it look ...
0
votes
1answer
49 views

Making an image slideshow

I wrote a function to make a image slideshow in javascript using for() loop, setTimeout() and ...
3
votes
1answer
263 views

Ring Timer Animation with Chasing Tail using CoreAnimation

After a fair amount of trial and error, I have gotten the animation acting in the manner that I want it, as seen here. However, I always feel like I'm writing way too much and too sloppily when trying ...
1
vote
1answer
182 views

Using GreenSock's autoAlpha property to show and hide images on hover [closed]

I have six tiles that I am animating on hover. The tiles invert from light to dark on mouseover and back to light on mouseout. My goal is for the inversion of the tile happen seemlessly and smoothly....
1
vote
1answer
27 views

Javascript plugin: scrolling based animations

I worked in a Javascript plugin the last couple of days, to implement scrolling based animations in websites. It's functional at the moment (here is the project page with a small demo). The code is a ...
4
votes
1answer
53 views

D3 animation explaining base-10 notation

This is my first D3 code. I am self-taught so I am not sure that the chaining of the transition follows the common best practices. Also, is there a way to avoid duplicating the "group" and the "anim" ...
4
votes
2answers
179 views

Lorentz Attractor visualization using functional programming

I have been working on this Lorenz Attractor visualization for the past day. I am currently also trying to change my coding style into a more functional programming one. I find it quite hard, to be ...
0
votes
1answer
72 views

React + jQuery Tab Scroller

A simple tab scroller built with React.js that utilizes jQuery for the animation. Questions I've only just started learning React and I've recently come across ...
14
votes
2answers
411 views

Counting people inside the house game

This program animates people going inside and outside of a house, the user has to keep a running sum in their head and must give the answer at the end. The speed of people, the number of maximum ...
24
votes
5answers
85k 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 ...
6
votes
0answers
90 views

Android component animatable on its height

I'd like to have a code review for a component which is supposed to be animatable on its height. It's supposed to be a transitioning element. I find it quite laggy on my phone. ...
2
votes
1answer
2k views

Animate a box, bouncing left and right

I wrote the following code for move a box to right and return it to left, and repeat this action forever. This code works, but is there a better solution? ...