Most voted "animation" questions
Animation is the rapid display of a sequence of visual effects in order to create an illusion of movement or change.
Learn more…165 questions
Sort by count of
-
67
votes3
answers5939
viewsWhat are the techniques for making scroll-based animations?
I’m interested in creating websites with scroll-driven animation (ex.: Kano), where content is animated and replaced as the page is scrolled. What are the techniques to facilitate such programming?…
-
12
votes2
answers596
viewsHow to animate the display of dynamically sized elements with CSS only?
I’m building a site that has some state transitions using CSS only. In one of them the user clicks the header and the div below displays or hides. In the other there is a sequence of images and when…
-
9
votes3
answers1750
viewsSmooth element animation swing via CSS Transform
The concept being sought is the continuous motion on the X axis between a value and its negative representation: So far, this concept has a flaw, the animation is performed from 0 degrees to the…
-
8
votes2
answers938
viewsCSS or Jquery for animation
When it comes to animation, which one should I use? Which one is the lightest? It is possible to do the same animations both in one and the other?
-
8
votes2
answers190
viewsWhat is Listviewanimations and how to use it?
I wanted to understand what the ListViewAnimations is (a component, a Framework?) and how it works.
-
8
votes2
answers174
viewsHow to do with CSS Downloader bar with animated background?
I saw this element that actually works as a "Loader" while the image is loading etc. And I tried to replicate it. Not the dynamics to function as a Loader, but yes this effect of the passing lines…
-
8
votes1
answer642
viewsHow do I hold an action key until I release the key
In video game games the action displayed when pressing a key is smooth, continuous and immediate. However when implementing a routine that animates a character according to the key pressed using the…
-
7
votes1
answer3240
viewsHow to rotate the character as the mouse moves?
I’m learning how to play a game, but even if I follow it step by step, I think I did something wrong. It moves correctly but just keeps looking forward and does not turn, I do not know if it is…
-
7
votes4
answers349
viewsHow to make an element cross the screen continuously and always visible?
I have a CSS animation of an element that crosses the entire screen, from right to left, continuously infinitely: #slider{ position: absolute; top: 50px; right: 0; background: red; width: 150px;…
-
6
votes2
answers230
viewsHow to avoid animation of elements that will not fit in the width of the screen?
I created an animation in jQuery for a customer’s Christmas card. However, on 1024x768 or 800x600 resolution screens, elements appear in strange places: The code below hides the balls at startup,…
-
6
votes1
answer412
viewsHow to make dynamic animations with CSS3?
I know how to make animations with Transition, Rotate + :Hover or triggering class change with JS. But what if I want a CSS3 animation that when rendered it does more than one move without being…
-
6
votes1
answer767
viewsHow to make a smooth animation in Progressbar?
I’m trying to implement a smooth animation in my ProgressBar, but, if I increase the duration time, the animation stops being "smooth". Example with 5 seconds: Example with 30 seconds: ProgressBar…
-
6
votes1
answer609
viewsCSS animation does not work on Mozilla
Guys, I’m having a little problem with a CSS animation. I made it work normally in Chrome and even in IE, but in Firefox it gives a bug. I tried to put the prefix -moz- in some properties, but…
-
6
votes1
answer183
viewsHow to make animation with SVG or CSS of a Text walking the way?
I have an SVG that is a Text aligned on a Path. But my intention is to do the text "running" by Path, as a Marqueer. The idea would be something like this image. But what I got was to animate the…
-
5
votes2
answers331
viewsHow to order animations with jQuery?
I have this code and I wanted to order the animations so that the header only begins after the .logo_1 end. I tried to use Duration but it didn’t work out very well, there is some other way for me…
-
5
votes1
answer379
viewsAnimation on Android, circle emitting waves
I need to do an effect similar to that of ZenUI in call, that the photo with circle emits waves (zoon from below) as can be seen in the video http://youtu.be/niWK2U71t28?t=1m38s Does that help a lot…
-
5
votes1
answer73
viewsFade Radial js or canvas
Hello, I wonder if there is some transition I can do in radial or style of dissolving paint (as if it were running paint)? For this purpose become cooler to open the site. Fiddle:…
-
4
votes3
answers4074
viewsShow/Hide animated information by clicking on the widget
I would like to perform a simple animation that is executed in the click event assigned to an element. This is the site that I will use this animation. Suppose my element is a circle, for example. I…
-
4
votes1
answer184
viewsAnimation of div, without CSS3 for future position
I have a so-called product gallery, with Ivs lined up using {display: block; float: left;} I made some Divs disappear depending on the menu selected using fadeOut() and reappear with fadeIn(). I…
-
4
votes2
answers1969
viewsHow to make a CSS animation stop in the last state?
I have a div, which is lively, and would not like that at the end of the animation she turns to the state of when she started, because she ends up returning to the original state at the end of the…
-
4
votes3
answers7988
viewsHow to put an animated GIF in an APP on Android?
Well, I have been with this problem for some time, I tried to solve using answers from Stackoverflow gringo but I was not successful. I need to put an animated GIF image in my Activity but Imageview…
-
4
votes2
answers2479
viewsHow to get this scroll effect - when scrolling the page?
On this site, by making any scroll movement at its beginning, it scrolls to the end of the section. I would like to know how this effect is executed correctly. http://seunovopontodevista.com.br/ Can…
-
4
votes1
answer579
viewscreation of gif in r
I’m trying to create a Plot GIF below: x<-NULL y<-NULL for(i in 1:500){ y[i]<-sum(rnorm(i))/i x[i]<-i plot(y~x, type="l") abline(y=0) Sys.sleep(0.25) }…
-
4
votes3
answers1946
viewsAnimate the text of a textView in order to be displayed progressively?
I would like the text of the textView present in my Activity not to be displayed all at once, but gradually, something like a Power Point transition. An example of what I want to do exactly would be…
-
4
votes1
answer443
viewsHow does each value that can be used in the CSS "Transition" (Transition-timing-Function) attribute work?
Usually when I want to make one transition to animate a CSS element, I usually use the value linear right after I set the time I want in an animation. Example: .boing-boing{ height: 100px; width:…
-
4
votes1
answer1013
viewsHow to make a CSS animation starting from one side in Hover and ending from the other when Hover comes out?
I have an animation where an element appears entering from left to right when I do the :hover in the .box, but I would like that when I took the mouse from the .box the element now exits from the…
-
4
votes2
answers397
viewsHow to animate a Radial-Gradient or Linear Gradient with CSS?
I’m trying to make an animation with CSS that would be a "sun" passing through an image. The idea was to have something next of that result: But in my code the "sun" is jumping from one side to the…
-
4
votes1
answer33
viewsjquery"Animate()" is not working
I want to use "Animate()" to pass feedback to the user after a click, but the animation is not happening. I used css to determine what would be the final state of the animation and there, it worked,…
-
3
votes2
answers585
viewsAlgorithm for calculation and distribution of elements on the screen
We are here at the company wanting to create a showcase with the effect of reorganizing style which is used by the stackexchange itself http://stackexchange.com/sites I’ve been thinking about…
-
3
votes1
answer672
viewsWhat better way to make animations for android?
I’m about to start an android system that has several animations that interact according to what the user does, I would like to know what is the best tool or framework to be able to develop these…
-
3
votes1
answer1791
viewsHow to make an animation by replacing images
Has a browser game on the internet it has a feature that I found interesting and would like to know how to do. As you can see in the picture, there are some buildings, some objects and some people!…
-
3
votes1
answer385
viewsCSS3 animation does not run when loading page
I have the following code: body{margin:0; padding:0; font-family: Verdana, Arial, sans-serif;} aside{ width: 200px; background-color:#F0F0F0; } ul{ display:block; list-style:none; margin:0;…
-
3
votes1
answer1135
viewsJS effect slip div and appear other
Next I have a home where the user will come across a field to login or a button to register. By clicking the Register button I would like this current content to disappear from the screen by sliding…
-
3
votes2
answers733
viewsHow to call two animations in an element that uses ":Hover"?
I have the following code: body { margin: 0; padding: 0; background: #885053; } #hide { width: 100%; height: 0px; background: #fe5f55; margin: 0 auto; -webkit-animation: hideSlideDown 0.5s forwards;…
-
3
votes2
answers998
viewsAnimation when changing the display into HTML
Hello my dear programmers friends of this our Brazil! I need your help on the following question: I have a button that when pressed changes the display from a div to block. So: CSS #form-pergunta {…
-
3
votes1
answer1218
viewsAnimation when you touch the button
I have a registration screen, where a standard photo is already set. If I press on top of the photo it opens 2 options to change the photo. Either grab by the gallery or take a photo. By clicking on…
-
3
votes1
answer178
viewsHow to use . toggle() to exchange animations
I’m trying to alternate the animation of a div using .toggle(), but this div, which is the first gray ball, simply disappears after I click the button (orange ball), instead of returning to its…
-
3
votes1
answer78
viewsHow to make the elements appear with the mouse scrool?
Visibility.onVisible(function(){ setTimeout(function(){ $(".animar").addClass("animated fadeInDown"); }, 400); setTimeout(function(){ $(".animar2").addClass("animated fadeInDown"); }, 800);…
-
3
votes2
answers104
viewsJava2d time-based drive
I’m trying to move an object using Java2d but I’m having some problems, I have following method: public void logics() throws Exception{ before = System.nanoTime(); loop.logics(diff); after =…
-
3
votes2
answers11060
viewsHow to center an iframe?
Have on my page an animated banner that I made in Google Web Designer that I incremented in my site to appear before loading the index page. So far so good, the codes are working but I would like to…
-
3
votes1
answer44
viewsHow to reverse the animation of an Animated-vector?
I am using the following Animated-vector: <animated-vector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:aapt="http://schemas.android.com/aapt"> <aapt:attr…
-
3
votes1
answer565
viewsHow to not let a CSS Animation stop even after the mouse has left the element
I have a div who has an animation in :hover, but if the user takes the mouse away from the div before the animation ends she cuts in half and does not finish. I tried to make a "spot light" effect…
-
3
votes1
answer111
views -
2
votes1
answer327
viewsAndroid: Improper layout change due to animation
Guys, I have a problem here and I’ve posted on international stackoverflow, but no one answered me, so I’m posting here to see if you have any charitable soul to help me. Come on!! I simply wanted…
-
2
votes1
answer145
viewsProblems with slideDown in jQuery
I’m having a problem that I have no idea what it might be, I understand very little of jQuery, in removing I managed to do the animation of .slideUp() but in adding that is a .append() I can’t make…
-
2
votes2
answers376
viewsjQuery Toggle Animation is not working
I have this code, and I would like you to toggle the click but it’s not working. Any tips sff? HTML: <body> <img id="topBar" src="imgs/topBar.png"> <div id ="wrapper"> <nav>…
-
2
votes1
answer149
viewsPrevent animation from repeating when changing the orientation of the device
I’m working on a screen that contains an animation that is repeated every time the screen is rotated. I searched but found no precise information of what I need to do so the animation does not…
-
2
votes2
answers598
viewsHow to put a click event in a primitive drawn form?
I made an animation and would like to put the buttons pause and play using these drawings in primitive forms. function botaoPlay() { contexto.beginPath(); contexto.fillStyle = "rgb(255,255,0)";…
-
2
votes2
answers480
viewsHow to keep the element in the final position of the animation?
I am using this code to make an effect and keep the element in the final position of the animation, ie to the right. HTML: <div id="anim"> </div> CSS code: #anim{ position: relative;…
-
2
votes2
answers559
viewsHow to remove and add a class in a SINGLE event?
Look at function rodarslider(){ (...) caption.classList.remove('sliderfect'); caption.classList.add('sliderfect'); (...) } The above function is the little chunk of the algorithm of a pure JS slider…