Questions tagged [jquery-animate]

Refers to jQuery's animate() method. For generic graphical animations, see the animation tag.

Refers to 's animate() method. For generic graphical animations, see the tag.

API Documentation.

Example usage:

$('p').animate({
    width: 200,
    height: 300
}, 1000, function() {
    alert('Animation complete!')
});

This particular animation modifies the width and height of all matching <p> elements over a period of 1000 milliseconds (1 second). Once the animation is complete, it fires an alert to inform the user.

Related tags

6162 questions
1
vote
1 answer

Is it possible to animate the css clip-path property using jQuery?

I have some elements whose properties are altered via the jQuery animate() method like that: $('#mySidenav').animate({"width": '-=190'}); $('#main_address').animate({"padding-left":…
niccober
  • 343
  • 1
  • 3
  • 7
1
vote
2 answers

Weird animation queue

I've been playing around with chained animations, and this has baffled me quite a lot I have just one element being animated, but the 'shake' effect is left to the bottom of the…
Otto Nascarella
  • 2,445
  • 2
  • 17
  • 8
1
vote
3 answers

FadeIn and FadaOut in same moment while animate

$(".item21").click((function() { var i = 0; return function() { $("#submenu").animate({ marginTop: (++i % 2) ? "+=330px" : "-=330px" }, 400); return false; }; })()); Where and what…
Goldie
  • 1,570
  • 5
  • 21
  • 33
1
vote
2 answers

animate backgroundPosition

Anyone know why the below would not work. If I just set the css directly without animate it works. //div.css( {backgroundPosition: "bottom left"} ); $("#menu li").bind("mouseover", function(){ var div=$(this).find('div'); div.css(…
Chapsterj
  • 6,483
  • 20
  • 70
  • 124
1
vote
1 answer

Implementing horizontal scrolling images using JQuery

I want to implement Horizontal scrolling images using JQuery. Basically I want to repeat animate() infinite times. Here is my code: HTML:

Test Text

1
vote
1 answer

Wait for ... after page load before initiating animation jquery

I wrote a script using jQuery so that a page automatically scrolls to a certain id tag when the page loads. I want this animation to wait 5 seconds after the page loads before it triggers. How can I do this? Here is the script I wrote: let…
seb-2020
  • 21
  • 2
1
vote
1 answer

How to make two jQuery animations play simultaneously?

I have these two things happen in my jQuery-animated website: $('#myFirstDiv').animate({top: "15%"}, 3000); $('#mySecondDiv').animate({bottom: "15%"}, 3000); These two animations seem to happen one after another, rather than simultaneously.…
Dimitri Vorontzov
  • 7,834
  • 12
  • 48
  • 76
1
vote
0 answers

How to animate the position of multiple divs with JQuery?

I have a list of
elements and would like to animate their positions. For example, I might have 4 div's inside a container as follows:
70
Espresso
  • 740
  • 13
  • 32
1
vote
1 answer

Start a css animation and finish with another icon using (fa-awesome)

Using plain CSS and Javascript I want to: Create a 'fa-heart-o' that animates a pulse when clicked. and at last change to a solid heart 'fa-heart'. Additional click should then reverse from 'fa-heart' -> animate -> 'fa-heart-o'. The first part is…
RePsEj
  • 49
  • 7
1
vote
0 answers

CHROME: Prevent jQuery slideDown() and prependTo() from moving whole screen

I have the following code that prepends an li element to a ul list: function prependListItem(entryHTML){ $(entryHTML) .hide() .css('opacity',0.0) .prependTo('#container > ul') .slideDown('slow') …
1
vote
2 answers

CSS / jQuery: Dynamically updated text appears right of instead of inside circular progress bar

I am trying to implement an circular progress bar with animation and came across the plugin from the below resource. I downloaded and included the plugin and used the source code (HTML and JS) from the demo page and with this it works. However, my…
keewee279
  • 1,656
  • 5
  • 28
  • 60
1
vote
2 answers

jquery 'show' + 'animate' only working on first click

I'm having a bit of trouble with show and animate used together. I want the box to show and fade in each time my_ids are clicked and to fade out whenever any other part of the page is clicked. But as it stands the animate to opacity: '1' only works…
1
vote
1 answer

Javascript: Open other page and proceed with actions

I am currently working on a one-page design with different subpages. I've had some troubles with linking anchors to the subpages so I tried to solve it with a little bit of JavaScript. My basic idea is to redirect to assign the following on click…
1
vote
1 answer

How to stop scroll animation without affecting the callback (jQuery.animate())

In my website app, I use scroll animations by calling this function: function Scroll_To_Top(element, offset, duration, easing, callback = null, args = null) { $('html, body').on('scroll mousedown wheel DOMMouseScroll mousewheel keyup touchmove',…
Ouatataz
  • 185
  • 3
  • 12
1
vote
1 answer

Infinite individual div animation

I would like to animate the moving behavior of my thumbnails divs. I want each individual div to move differently. The grid itself is also infinite scrollable in both directions. At the moment I have the following problem: The divs are moving all…
Dennis
  • 11
  • 2
1 2 3
99
100