I don't think so. The number of pixels is not a fixed number between the positions in the menu. There are 5 icons and 5 positions, so I use an array of 5 objects that contain css properties(left, top, zIndex, width, height and opacity) of each position. The problem with calling .animate() once is that each icon has to move through an adjacent position before moving on to the destination. If I call .animate() only once with the final destination, it will move in a direct line which is not a desired effect. On Wed, Jan 14, 2009 at 5:52 AM, Karl Swedberg <k...@englishrules.com>wrote:
> Is it possible to have a variable for the number of pixels by which the > menu animates (and doubling it when necessary), rather than calling animate > twice? > Also, .animate() is part of jQuery core, so you've posted to the correct > group. ;-) > > --Karl > > ____________ > Karl Swedberg > www.englishrules.com > www.learningjquery.com > > > > > On Jan 13, 2009, at 4:29 PM, Miloš Rašić wrote: > > Here's the function I use to rotate the menu: > http://paste.pocoo.org/show/99509/ > The icons are located inside divs with ids 'pos_1' through 'pos_5', 'pos_1' > being the leftmost icon, and 'pos_5' being the rightmost icon. The all have > class 'pos'. > > The problematic case occurs when the user clicks on 'pos_1' or 'pos_5' and > the menu has to be rotated by 2 steps. rotate() is then called twice, and so > the call to .animate() is executed twice for each div. I can't use a single > call to .animate() because then the divs would jump directly to their final > destination instead of passing through adjacent positions. > > I've tried the following alternatives: > > 1) Using queue: false and using the second call with setTimeout so that it > is executed just before the first animation completes. > > 2) Using queue: true as in original code but calling .stop() a fraction of > a second before the first animation completes on its own so that it is > interrupted and the second animation in the queue starts immediately. > > 3) Putting the second call to .animate() in the callback function of the > first animate. > > All of these alternatives produced exactly the same results as the original > code. The rotating menu makes a noticeable pause after the first animation > before proceeding with the second. > > On Tue, Jan 13, 2009 at 8:20 PM, Nikola <nik.cod...@gmail.com> wrote: > >> >> It's hard to tell without having a look at the code. You may want to >> try http://paste.pocoo.org to post code like this. >> >> Are you chaining the animations? ie. $(this).animate({},speed).animate >> ({},speed).animate({},speed); >> >> You could always try setting a delay on your second animation with >> setTimeout. >> >> setTimeout ('$(this).animate({},speed)', 400); >> >> Hope that helps. >> Nikola > > > >
