Question

I’ve run into a small problem, Ive got a page full of anchor tags and when 1 of them is selected an animation begins, my only problem right now is that I havent defined the anchor tag as (this) so when a series of anchors are selected each of them perform the animation, im not sur right now how I can change the a tag to this though?

My code so far is:

$('a').bind('click', function(e){
            $ajax = $('<div id="ajax"></div>');
            $ajax.prependTo('#container');
            $('html, body').animate({ scrollTop: 0 }, 'fast', function(){
                $ajax.animate({ height: 300 }, 'slow', function(){ 
                    $preloader = $('<div id="preloader"></div>').hide();
                    $preloader.prependTo('#ajax').fadeIn('normal');
                });
            });
            e.preventDefault();
        });

Answer 1

You do not use var keywords. This is bad, as all variables you create this way are in the global scope overwriting each other

$('a').bind('click', function(e){
    var $ajax = $('<div></div>').prependTo('#container');

    $('html, body').animate({ scrollTop: 0 }, 'fast', function(){
        $ajax.animate({ height: 300 }, 'slow', function(){ 
            $('<div></div>').hide().prependTo($ajax).fadeIn('normal');
            // you can refer to $ajax here! --^^^^^
        });
    });
    e.preventDefault();
});