Trying to make a "<div />" show up below a link that have been clicked.

Using delegate since there are multiple link on the site and I want to show them below the linked that is clicked.

I having a hard time figure out what the best/right/optimal way is to do that. Since I'm by no means a jquery expert yet.

I have tried using the position, and that does position the <div /> the right place, but now I'm having a hard time doing the slideDown.

This should first display that its loading. If its successful it should just show a message and then disapear again. If theres an error, let is stay so the user knows it failed.

I'm not sure what the above is called if there is a plugin for it else any information on how to construct this would be very helpful.

This is the code I got so far: ( The " @* *@" is used to make comments in an asp.net mvc page.

2. list.delegate("a.copy", "click", function () {
3.             var element = $("<div />").html("Information, should also cantain an image later").addClass("ajax-information");
4.             var div = $(this).closest("div");
5.             element.appendTo(div);
6.             $(element).position({
7.                 of: $(this), @* Parent item *@
8.                 my: "right top", @* Child item that Im actually positioning to the parent *@
9.                 at: "right bottom", @* // This is the parent *@
10.                 offset: "0 0"
11.             });
12.             element.hide();
13.             element.slideDown();
14. 
    
    
15.             return false;
16.         });
17. 
    
    
18. 
    
    

Is this the right way to do it?

I'm a little in doubt of the: hide() needs to be after the appendTo and position calls or else it gets positioned completed wrong.

Any input are most welcome ... love jQuery, but hate that I'm not that good at it yet.

mvh