jQuery empty()/remove() makes page jump -


I have a monitoring website that is "logged in" and their "state" (online / away / etc) Shows up .

These are basically wrapped under the bottom of your page:

  & lt; Table cellpadding = "0" cell spacing = "0" id = "telecaster_agentenstatus" class = "telecastaster" & gt; & Lt; TR & gt; & Lt; Td id = "free_agents" & gt; & Lt; / TD & gt; & Lt; Td id = "acw_agents" & gt; & Lt; / TD & gt; & Lt; Td id = "pause_agents" & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; Tr id = "telecaster_agentenstatus_start" & gt; & Lt; Td id = "agentenstatuus" colspan = "3" & gt; & Lt; Div class = "agent_telecaster_container" & gt; & Lt; / Div & gt; & Lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt;   

Then enter the div with all the "agent" class "agent_telecaster_container" I add as many devices as I need:

 for  (nameAgent In supervisionagents.group [0] .agent) {//$( (#agentenstatuus").append('<div class = "agent_telecaster"> '+ nameAgent +'  ') ; Counter ++; If (supervisionagents.group [0] .jent [name]] .stateCurrent.description == "inactive") {$ (". Agent_telecaster_container"). Attachment ('& lt; div id = "agent' + counter + '" class = "agent_telecaster">   

which is called repeatedly.

I need it to be "clear" with its content, because it may be that every other person is offline or online.

So far it is possible with a simple:

  $ ('agent_telecaster_container'). Blank () / .remove ();   

But what happens if I move my view / scrollbar to see some things under that table, with each reload (every second) Jumps back on. I think it is due to its removal / empty and this element is removed but new material goes in.

Do anyone have any ideas about preventing jumping? : /

Have you tried to hide the element for the first time, and then tried to delete it is? . Delete .hide (); Or try the fadeaut () then remove the call in the callback ():

 . FadeOut ('fast', function ($ ('agent_telecaster_container'). Remove ();));    

Comments