animate

slideUp is choppy - but slideDown and slideToggle are fine - no styles applied

I have a div that looks good when animated with slideToggle, and slideDown, but slideUp looks bad. By bad I mean that while the boundaries of the div change smoothly, the words inside the div shift position and disappear quickly one by one. Highlighting the div in Chrome Developer Tools/Firebug, it appears something is reducing the w...

How can I execute multiple, simultaneous jquery effects?

I am animating some error/validation elements on a page. I want them to bounce and be highlighted, but at the same time if possible. Here's what I'm currently doing: var els = $(".errorMsg"); els.effect("bounce", {times: 5}, 100); els.effect("highlight", {color: "#ffb0aa"}, 300); This causes the elements to first bounce, and THEN be...

Transparent PNG animate problem on Internet Explorer

CSS Code: #btn{ background: url(transparent.png) no-repeat; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } JavaScript/jQuery: $("#btn").animate({opacity:1,"margin-left":"-25px"}); I don't have any problem with the code above on Firefox, Chrome and others. But it does not work on any version of...

Firefox/IE don't animate padding-left with jQuery (only able to get Chrome to animate)

$("a").hover(function(){ $(this).animate({ 'padding-left': '+=10px' }, "normal"); }, function(){ $(this).animate({ 'padding-left': '-=10px' }, "normal"); }); I have the above piece of code, which would normally animate the padding of an "a" tag on hover. This works fine in Chrome, but not on Firefox nor ...

JavaScript/jQuery: Follow path over page

I need to make an animated gif 'fly over a page and follow a path. I'm thinking of using jQuery but would I be right in thinking the only way to do it is manually calculating the percentage of width/height where the shape layer should be placed, then using absolute positioning is the only way to do this? I know there are some amazing jQu...

why i can't change the 'div''s background color to 'yellow'.

$('div').animate({ 'background':'yellow' }, 2000,'linear', function() { }) why?? thanks ...

jQuery animating background color - not working

Anyone see what's wrong with my code? I just can't figure it out!! The file paths are correct, and if i look in the console when i hover the h3 element, it outputs the text in "hover" just as it should. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; <html> <head> <t...

jQuery problem: moving a <li> from one <ul> to the top of another

I have two ULs, one above the other: <ul id="one"> <li> <li> <ul> <div id="div_for_second_UL"> <ul> <li> </ul> </div> In the first, each LI has a button that, when clicked, removes the LI and bumps the below LIs up one space to fill in the gap. It works fine. But I want the clicked LI to simultaneously be added to the top o...

jquery animate browser window

Hi, Is there a way to animate a browser window using jquery. Right now I'm essentially using this: $(window).animate({ left: '+=50' }, 5000}); The reason why it isn't working is probably obvious, although not for me. I eventually need to loop an animate effect so that the browser will move back and forth dynamically. Thanks. ...

jQuery: How can I animate to a taller height with the height being added to the top of the element?

Hi, I have a simple problem but I am not sure how to solve it. Basically I have some hidden content that, once expanded, requires a height of 99px. While collapsed the element holding it section#newsletter is set to be 65px in height. LIVE EXAMPLE: http://dev.supply.net.nz/asap-finance-static/ On the click of a#signup_form the section...

jQuery - How to animate click function without clicking (Slide-show like) - Is this possible?

Hello, I have created a jQuery script (with help) that works great however I need it to automate/animate itself without using the click function, I just want to know is this possible and if so, how? Similar to a slide-show. Basically the code allows me to click on an image and hide/show a DIV, while changing a list of elements such as c...

jQuery fadeOut, replaceWith, animate almost working

I am trying to accomplish the following: 1. On click, have a div with id="fader" fadeout 2. replaceHtml of fader with new html (this new HTML will appear below the fold of the browser) 3. Animate new HTML to slide up to the specified location Step 1 and 2 are working, step 3 is not and I'm stumped as to why. Here's the javascript: $("...

jQuery - Need help stopping animation on click command.

With a few of your help I was able to get the jquery I wanted to work flawlessly, except for one thing.. the animation doesn't stop when i click on the buttons. Scenario: I have an Image, and 3 buttons underneath labeled "1","2", and "3". The jquery will automate the click function every 4500ms and switch from 1 to 2, then 2 to 3 and co...

NOOB question... variable for animate value?

I have a variable that I would like to use to use as an animation value in pixels: var thisAmount = maxScrollIncrements*DISPLAY_WIDTH $("#image").animate({left:"+=thisAmount", opacity:1.0}, "fast"); So in this case if "thisAmount" = 1200, I want the equvilant of: $("#image").animate({left:"+=1200px", opacity:1.0}, "fast"); I know t...

Android: how to hide and then show View with animation effect?

I have similar question like this one: http://stackoverflow.com/questions/2079074/update-layout-with-the-animation Basically: I have one vertical LinearLayout View with edittext, button and then list. I'd like to hide exittext after pressing button to make more space for list (button will go up). On second press edittext should be visib...

jQuery using .animate() fails to do ANYTHING in IE8

So, it's official: I hate Internet Explorer. Yes, all bloody versions of it. :-D So, I didn't think I was doing anything complicated here, but apparently I am. I have a bunch of list items in an unordered list styled for a navigation menu, and in Firefox, Chrome, Safari, and Opera, things work fine. What is supposed to happen is wh...

SVG, animate a line from x1,y1 to x2,y2?

The animate property is very loosely documented. And unfortunately for me, the way the W3 documents SVG is VERY difficult understand and cross reference. I'VE GOTTEN IT TO WORK (... a step forward at least) THANKS MEF! ... should've known to convert seconds to milliseconds (slaps, forehead) I've updated the code to reflect my next ste...

.animate question/help

So, I've built this navigation bar so far and I'm curious if it's even possible to achieve what I'm thinking. Currently, when you hover over each of the links they drop down (padding is increased). Now, what I'm curious in doing is if you hover over say "test1", test2-4 also drop with it but in the padding that has been created from the...

iPhone UIScrollView - How to animate scrolling with steady contents?

Hi all, I'm wondering if anyone knows how to prevent the contents of a uiscrollview from moving unsteadily when scrolling manually by setting the content offset. When scrolling by touch the text remains clear and steady. I would like to recreate this by animating with the animated option set to false. I'm using a timer to scroll at a...

jquery animation callback - how to pass parameters to callback

I´m building a jquery animation from a multidimensional array, and in the callback of each iteration i would like to use an element of the array. However somehow I always end up with last element of the array instead of all different elements. html: <div id="square" style="background-color: #33ff33; width: 100px; height: 100px; positi...