Menu

Soulignement d'un element texte en javascript

Messages postés
3
Date d'inscription
vendredi 8 mars 2019
Dernière intervention
11 mars 2019
- - Dernière réponse : cyberMan_89
Messages postés
3
Date d'inscription
vendredi 8 mars 2019
Dernière intervention
11 mars 2019
- 11 mars 2019 à 05:49
Bonjour à tous,
Voici mon problème, J'ai crée une module pour le soulignement d'un texte en javascript! Si je sélectionne une seule ligne tous marche avec la perfectionnement, mais quand je sélectionne plusieurs lignes, le soulignement a tendance a suivre la sélection de l'élément qui est plus grand largeur! Pour information, J'utilise window.getSelection().
Afficher la suite 

Votre réponse

3 réponses

Messages postés
24977
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
20 mars 2019
1899
0
Merci
Bonjour,

Sans voir ton code IMPOSSIBLE de te répondre !

NB: Pour poster du code sur le forum, merci de le faire en utilisant LES BALISES DE CODE (et en y précisant le langage afin d'avoir la coloration syntaxique)
Explications disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
.
Commenter la réponse de jordane45
Messages postés
3
Date d'inscription
vendredi 8 mars 2019
Dernière intervention
11 mars 2019
0
Merci
Bonjour,

merci d'avoir répondu et voici mon code que j'utilise:


var s = window.getSelection();
            var oRange = s.getRangeAt(0);
            var oRect = oRange.getBoundingClientRect();

var $eleStart = $(document.getSelection().anchorNode.parentNode);//debut de la selection
            
var $eleEnd = $(document.getSelection().focusNode.parentNode);//fin de la selection

function appendHrWithSaveDataLigne($eleStart,$eleEnd, oRect, widthNew, posXNew, background)
       {
           var nextEle=$eleStart;
           var prevEle=$eleStart.prev();
           var id_max=0;
           var width=null;
           var posX=null;
           var posY=null;
           var posYPrev=null;
           var bg=null;
var tab_obj_ligne=[]; //tableau temporaire pour afficher les div ou soulignement
           
           if(typeof (background) != 'undefined')
           {
               bg=background;
           }
           else
           {
               bg='black';
           }
           if(typeof (widthNew) != 'undefined')
           {
               width=widthNew;
           }
           else
           {
               width=parseInt(oRect.width);
           }
           if(typeof (posXNew) != 'undefined')
           {
               posX=posXNew;
           }    
           else
           {
               posX=parseInt(oRect.left-15);
           }
           /**
            * 
            * recuperation de l'id le plus eleve
            */
           for(var i=0;i<tab_obj_element.length;i++)
           {
               if(parseInt(tab_obj_element[i].id) > id_max)
               {
                   id_max=tab_obj_element[i].id;
               }
           }
           id_max++;
           var id_page=null;
/**
* récuperation des blocs de selection
**/

               do
                {  
                        posY=(parseInt(nextEle.css("top"))+parseInt(nextEle.css("height"))+3);
                        
                            id_page=parseInt($eleStart.parents(".PDFPage").attr("id").substring(5, $eleStart.parents(".PDFPage").attr("id").length));
                            var obj_ligne={

                                    id:id_max,
                                    width:width,
                                    height:parseInt(nextEle.css("height")),
                                    posX:posX,
                                    posY:posY,
                                    page:id_page,
                                    background:bg,
                                    type:'ligne',
                                    size:'2',
                                    padding:'1'
                            };
                            
                            /**
                             * 
                             * retire les doublons dans le tab_obj_element
                             */
                            var isTrouver=false;
                            
                            for(var i=0; i<tab_obj_element.length; i++)
                            {
                                if(tab_obj_element[i].type  == 'ligne')
                                {
                                    if(tab_obj_element[i].posX == obj_ligne.posX && tab_obj_element[i].posY == obj_ligne.posY && tab_obj_element[i].width == obj_ligne.width)
                                    {
                                        isTrouver=true;
                                    }
                                }
                            }
                            
                            if(!isTrouver)
                            {
                                tab_obj_element.push(obj_ligne);
                                tab_obj_ligne.push(obj_ligne);
                            }
                            
                            
                            id_max++;
                            //console.log(posY);
                            nextEle=nextEle.next(); 

                }
                while(parseInt(nextEle.css("top")) <= parseInt($eleEnd.css("top")));

/**
                 * affichage du element div
                 */
                for(var i=0;i<tab_obj_ligne.length;i++)
                {
                    if(tab_obj_ligne[i].type == 'ligne')
                    {
                        //asina hr
                        if(tab_obj_ligne[i].page == id_page)
                        {
                            var $hr=$('<div></div>');
                                    $hr.css({
                                       position:'absolute',
                                       top:tab_obj_ligne[i].posY+'px',
                                       //left:roundXSel+'px',
                                       left:tab_obj_ligne[i].posX+'px',
                                       width:tab_obj_ligne[i].width+'px',
                                       padding:'1px',
                                       background:tab_obj_ligne[i].background,

                                    }).addClass("ligne").attr("id",tab_obj_ligne[i].id/**+id**/);
                                    $eleStart.parents(".PDFPage").append($hr);       
                        }
                    }
                }
                tab_obj_ligne=[];//initialisation du tableau après affichage

merci pour votre aide!
Commenter la réponse de cyberMan_89
Messages postés
3
Date d'inscription
vendredi 8 mars 2019
Dernière intervention
11 mars 2019
0
Merci
bonjour,

Est-ce que quelqu'un peut m'aider! S'il vous plaît, je besoins de votre aide!
Commenter la réponse de cyberMan_89