Ah, I've never used the interface version of animate.
Sorry about the typo. That's what I get for not testing it :) Glad it helped.
--Erik
On 6/4/07, JMParsons <[EMAIL PROTECTED]> wrote:
I had been using Interface's plug-ins, that's why my markup took on
the "style:" versus the non-Interface markup. The last example got me
up to speed quick. I know about the chaining of events, but just
couldn't figure out how it was handled, especially in terms of
functions. I am using $('html').width(), but it and $('body').width()
both work as far as I can tell, in both ie7 and firefox for getting
the documents width. There was a missed closed bracket in:
$('#wrap').css({width: $(document).width()}).animate({width: 770,
'slow');
It's after 770, but it didn't take long to find. After fixing that and
testing it out, it worked like a charm! Thanks for the feedback.
On Jun 4, 7:41 pm, "Erik Beeson" <[EMAIL PROTECTED]> wrote:
> I think your syntax for animate is a little off. It should be like:
>
> $('#wrap').animate({width: 770}, 'slow');
>
> To get the effect you're looking for, do the animation in pixels, then
> change it to percent when it finishes:
>
> $('#wrap').animate({width: $(document).width()}, 'slow', function() {
> $(this).css({width: "100%"});
>
> });
>
> And to go back to 770px, first change it to px, then animate it:
>
> $('#wrap').css({width: $(document).width()}).animate({width: 770, 'slow');
>
> If you don't change to pixels first, it will animate from 0 to 770
> instead of 100% to 770.
>
> I think you need the dimensions plugin to do $(document).width(), but
> $('body').width() might get you the same thing without it. I'm not
> sure about that though.
>
> --Erik
>
> On 6/4/07, JMParsons <[EMAIL PROTECTED]> wrote:
>
>
>
>
>
> > I've been trying to create animations with width values in percent.
>
> > For instance, I have a div wrapper around my page called wrap, and I'm
> > trying to be able to toggle it's width with .animate() from 770px wide
> > to 100% wide. For the most part I'd like to keep it as an animation,
> > so it fluidly expands or contracts from one value to the other. I can
> > achieve this easily using .css() or .width(), however I can't seem to
> > figure out how to imply percent values within .animate().
>
> > $('#wrap').animate({style: 'width: 100%'},1000);
>
> > This returns 100px.
>
> > Closest I could get was:
>
> > $('#case').animate({ opacity: 'show'}, "slow").width('100%'); //or
> > width(770)
>
> > All this does though is blink's the opacity, and show's the new value,
> > however it does keep the value intact with units in percent.- Hide quoted
text -
>
> - Show quoted text -
