jquery-animate

问题 I see here that the lack of backgroundPosition animation in jquery 1.5.0 is a known bug. Has it still not been fixed? See this jsfiddle, with backgroundPosition animating in jquery 1.4.4, and then look at this one, and see that it isn't working even in jquery 1.7.1. Any idea when they're going to fix this? I'm wondering because I just saw a warning in my Chrome console saying this: event.layerX and event.layerY are broken and deprecated in WebKit. They will be removed from the engine in the

问题 haven't done much jquery and ran into a problem. I'd like to bind hover event for all div's with class .social-tile. I do it like this: $(function(){ var social_default = $('.social-tile').css('margin-right'); $('.social-tile').each(function(){ $(this).hover(function(){ $(this).animate({ 'margin-right': '0px' },500); },function(){ $(this).animate({ 'margin-right': social_default },500); }); }); }); When I hover over one element, animations for all divs are triggered and they move all at one

问题 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: $("#fader").fadeOut(1000, function() { $(this).replaceWith('<div id=\"fader\" style=\"margin-top:-500px;width:500px;height:400px;border:1px solid black;\">new div<

问题 I am prepending some data to my page on a button click and instead of just populating immediately on the page, I was wondering if there is a way to animate the prepend() using slideToggle or CSS animation. Here is my current script: var data = $('.data').html(); var insert = '<div class="data-container">'+ data +'</div>'; $('button').click(function(){ $('.data-container').remove(); $('.initial').prepend(insert); }); and a JSFiddle 回答1: You have to do something like this: var data = $('.data')

问题 I'm trying to get a div #sidebar that rests above my main #stream div to move from position left: 565px; to position left: 0px; onClick of one image in the #sidebar div (the red arrow in the images below), and do the reverse onClick of the same image. I know I have to use JavaScript, but I have no idea what the code would be. If possible, I would like to animate the div move too. The pre-clicked state (the arrow will be my link): The post-clicked state: Thanks in advance! 回答1: If you want to

问题 I'm having a problem with setInterval and jquery animate. Here is my code: function slides1() { ... $("table#agah1").animate({ "left": first1 }, "slow"); $("table#agah2").animate({ "left": first2 }, "slow"); } $(function () { cyc = setInterval("slides1()", 3000); }); When switch to another browser tab, and return after a time, the animation keep doing it without delay, for the time I've been away from the tab, and then act correct. I've added these also without any luck: $(window).focus

问题 JavaScript is a single threaded language and therefore it executes one command at a time. Asynchronous programming is being implemented via Web APIs ( DOM for event handling, XMLHttpRequest for AJAX calls, WindowTimers for setTimeout ) and the Event queue which are managed by the browser. So far, so good! Consider now, the following very simple code: $('#mybox').hide(17000); console.log('Previous command has not yet terminated!'); ... Could someone please explain to me the underlying

问题 I'm having a hard time googling this issue because most of the things I can find are about animations that are supposed to be fast but are acting slow. My question is regarding an animation that I want to have a long duration but still be smooth. I've created this jsfiddle to demonstrate the issue: http://jsfiddle.net/93Bqx/ I'm trying to make an element slowly move to another position over time. But the animation is very choppy. Basically, it boils down to something like this: $elem.animate(

问题 A simple question: Why can I do this var start = function() { $('#element').animate({}, 5000, 'linear', start); } but not this function start() { $('#element').animate({}, 5000, 'linear', start()); } ? The first works perfectly, restarting the animation after it completes. The second simply causes an infinite loop. 回答1: Either use function start() { $('#element').animate({}, 5000, 'linear', start); } or function start() { $('#element').animate({}, 5000, 'linear', function(){ start(); }); }

问题 how do I determine the positions in percentages? $(document).ready(function(){ $("#button").toggle(function(){ $("#slide").animate({top:-100%},1000); },function(){ $("#slide").animate({top:0%},1000); }); }); Please suggest. 回答1: $(document).ready(function(){ $("#button").toggle(function(){ $("#slide").animate({top:'-100%'},1000); },function(){ $("#slide").animate({top:'0%'},1000); }); }); Add quotes. (I used single quotes, but js doesn't care if it is ' or ") 来源： https://stackoverflow.com