hi,
it seems like it doesn't remove the 'clicked' class.
if i remove the class manually it works again.
what about:
$('#content_container img').removeClass('clicked');
or:
$('.site_thumbs').children('img').removeClass('clicked');
or:
$('.clicked').removeClass('clicked');
don't know. something like that.
-weidc
On 31 Okt., 07:13, Omid S <[EMAIL PROTECTED]> wrote:
> wow, I cant say much about your code, but your page looks awesome.
>
> On Oct 30, 8:13 pm, OscarGodson <[EMAIL PROTECTED]> wrote:
>
> > This is a fairly advanced jQuery animation I am doing on a site I am doing,
> > but I know it's failing at alert('2'); as you will see it in the comments. I
> > have tried TONS of things and nothing is working, but it's only not working
> > after a user pushes the back button. The entire thing totally tweaks out. I
> > heavily commented it so you know what and why I am doing things.
>
> > Here is a link to just this part of the sandbox for this. Right now, you
> > will see the splat logo and the info for oscargodson.com no matter what you
> > choose, THIS IS NORMAL
> > . I was doing that for testing. I just want it so a user can choose an
> > image, go back, choose another, go back, etc.
>
> >http://oscargodson.com/labs/boozker/sites.php
>
> > P.S. I haven't even looked at this in IE7 yet :wistle:
> > So use Firefox or Safari to see what i see
>
> > $('.site_thumbs').siblings('div').css({display:'none'});
> > $('.site_thumbs img').mousedown(function(){
> > //Add a class to what was clicked so we can get it again.
> > $(this).addClass('clicked');
> > //We need the alt text to tell us which DIV to unhide later.
> > var clicked_element = $(this).attr('alt');
> > //Get Positioning and Height Info so we can save things the
> > way they are
> > //when we set it position:absolute which has no height
> > associated with it
> > //nor will it stay in place, so get the info and hard code
> > it to the
> > element.
> > var position = $('.clicked').position()
> > var positionLeft = position.left;
> > var positionTop = position.top;
> > var containerHeight = $('#content_container').height();
>
> > //Now lets get that clicked element's siblings and animate
> > them out with
> > opacity
> > //alert('1');
> > $(this).siblings('img').fadeOut(400,function(){
> > //alert('2');
> > //!!!ERROR!!!
> > //Now that we faded out the sibling images let's
> > get rid of them
> > //$(this).css({position:'absolute'});
> > //Let's get the height we set above and hard code
> > it so it wont collapse
> > on us.
> >
> > $('#content_container').css({height:+containerHeight+'px'});
> > //OK, get x,y coordinates(positionLeft,positionTop)
> > and hard code them.
> > //After that animate to coordinates of the first
> > image (40px,15px)
>
> > $('.clicked').css({position:'absolute',left:+positionLeft+'px',top:+positionTop+'px'}).animate({left:'40px',top:'15px'},300,'easeInOutBack',function(){
> > //alert('3');
> > //Fade out the thumbnail an get the content
> > ready.
> > $(this).fadeOut(300,function(){
> > //alert('4');
> > //Get the new height of the
> > container with the content in it for later
> > use
> > var bodyCopyHeight =
> > $('.site_'+clicked_element).height();
> > //Change the height to fit the new
> > content plus add some padding on the
> > bottom
>
> > $('#content_container').animate({height:(bodyCopyHeight+5)+'px'},700,'easeOutBounce');
> > //Show the corresponding div that
> > is hidden
> >
> > $('.site_'+clicked_element).fadeIn(400);
> > //Create the goback function
> > $('.goback').click(function(){
> > //alert('5');
> > //Since the .goback span is
> > inside the div you want to hide, we want
> > the span's parent div
> >
> > $(this).parent('div').fadeOut(600,function(){
> > //After it fades
> > out animate the height change which makes the height
> > back to the
> > //way it was from
> > the start
>
> > $('#content_container').animate({height:containerHeight+'px'},500,function(){
> > //Make the
> > clicked element positioned back to static so it's back in
> > the same spot again
> >
> > $('.clicked').css({position:'static'});
> > //After the
> > .clicked element is back in place fade in the thumbnails
> > again
> >
> > $('.site_thumbs img').fadeIn(1000,function(){
> >
> > //After they appear take off the clicked class so now everything is
> > back to normal.
> >
> > $('#content_container').removeClass('clicked');
> > });
> > });
> > });
> > });
> > });
> > });
> > });
> > });
> > --
> > View this message in
> > context:http://www.nabble.com/Advanced-jQuery-Animation-Problem-tp20259541s27...
> > Sent from the jQuery General Discussion mailing list archive at Nabble.com.
