Obtention du centre de la page à chaque scroll avec page séparé

Bonjour,

J'ai un petit souci et vous sollicite votre aide s'il vous plaît!
En fait, voici mon problème, j'ai un page html qui permet de lire et d'insérer un nouveau div éditable pour l'ajout d'un nouveau texte dans un fichier pdf et sur le menu il y a un boutton qui permet d'insérer un nouveau texte.
Et voici son monde de fonctionnement, à chaque fois qu'on créer un nouveau texte alors il y a un div qui permet d'ajouter un texte, et ce div doit toujours se positionné sur le centre du document même à chaque scroll. Et jusqu'ici tous fonctionne bien avec ce code:

Boutton qui permet d'ajouter du texte:

          var $new_div=$('<div id="'+id_max+'"  class="draggable "  contenteditable="true" data-text="Nouveau Texte"  style="color:black;  z-index:100; fontSize:16px; margin:0;padding:5px;position:absolute;top:'+position_scroll_top+'px;left:368px;width:150px; height:42px; border: 3px black solid; word-wrap: break-word; overflow:hidden; word-break:break-all; padding-left:10px;">Votre texte ici</div>');  
   

Le div qui permet d'ajouter du texte et centré sur le document grâce à la propriété position_scroll_top:

position_scroll_top= 200+$("#mainContainer").scrollTop();

Tous fonctionne très bien mais le problème c'est que quand je sépare le document par page à l'aide de ce fonction:

function isShowen(elem){
            var $elem = $(elem);
            //mainContainer et le div principal du document
   var $window = $("#mainContainer");
  
   elemTop = $elem.offset().top;
   //elemTop permet de marquer le note de la page à chaque scroll 
   //si le document et <=70 et >=-1185 alors le note de la page change
            return elemTop<= 70 && elemTop>= -1185;
        
    }

  $(".PDFPage").each(function(index){
               if (isShowen(this)){
//                   console.log("PAGE VIEWED "+(index+1));
                   $("#actualPage").text((index+1));
                   //console.log(index+1);
                   pageConcerner=index+1;
 }

Ce qui permet de marquer la page comme l'image ci-dessous:


Mais ce qui est étrange c'est que dans le premier page le texte s'affiche bien au centre du document à chaque scroll mais lorsque je passe sur la deuxième page et que j'insère un nouveau texte alors le texte ne se positionne plus au centre mais elle saute tout de suite dans la troisième page et sa valeur varie bizharrement.

Quand je comment le code

 return elemTop<= 70 && elemTop>= -1185;

qui permet de numéroté le page alors tous fonctionne bien mais lorsque je l'active et que le page est numéroté page 1, page 2,... alors de nouveau quand je scroll sur la deuxième page, le texte ne se positionne plus sur le centre mais saute dans la troisième page et ainsi de suite.Comme l'image ci-dessous:



Ce que je veux donc c'est que le texte s'ajoute toujours au centre du document même si le document est séparé par un numéro de page.

C'est un peu long à expliquer mais j'espère que vous avez compris mon problème et vous sollicite votre aide.

Cordialement,