javascript - Create a child div accordingly if another child already exists at that location (x,y) -

javascript - Create a child div accordingly if another child already exists at that location (x,y) -

i inserting textarea side bar (exactly on right to), wherever click made on page. code is:

$('#page_to_be_clicked').click(function(e){ var offset = $(this).offset(); var comment_box_y_coord = e.pagey - offset.top; alert(comment_box_y_coord); $("#sidebar").append('<textarea id="cmmnt" rows="4" cols="10" '+ 'style="position:absolute;top:'+comment_box_y_coord + 'px;left:5px"></textarea>'); })

the problem that, if textarea nowadays @ location, overlap existing, i.e. if click made twice @ same point on page, 2 textareas created on top of each other. instead, should created 1 below other.

is there way check, if kid exists @ required co-ordinates?

any help appreciated. thanks.

how should textareas appear on clicks in sequence:

this needs tested properly, think need this:

demo

in function alter line:

var comment_box_y_coord = checkcoords(e.pagey - offset.top);

and add together function:

function checkcoords(y) { if ($("textarea").length>0) { $ts = $("textarea"); (var = 0; i<$ts.length;i++) { var $ti = $ts.eq(i), tcoords = [$ti.offset().top, $ti.offset().top+$ti.height()] if (y>=tcoords[0] && y <= tcoords[1]) { y = tcoords[1]+3; } } } homecoming y; }

javascript jquery html css position