IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Une< DIV> insérée, par une fonction, ne s'aligne pas dans une ligne <P>


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 374
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 374
    Billets dans le blog
    8
    Par défaut Une< DIV> insérée, par une fonction, ne s'aligne pas dans une ligne <P>
    bonjour a tous

    ma fonction d'insertion d'un div englobant une selection fonctionne mais le div va tout de suite a la ligne je ne sais pas comment le faire rester sur la meme ligne dans un content editable(WYSIWYG)


    la fonction

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    <script type="text/javascript">
    var elementactif;
    function selection(){ return window.getSelection().getRangeAt(0);}
    function Insertdiv() {
    var container = document.createElement("div");
    container.style.width="200px";
    container.style.height="200px";
    var divID="div" + document.getElementsByTagName ("DIV").length;
    container.id=divID;
    container.style.border="1px solid black"; 
    container.style.border="1px solid black"; 
    container.innerHTML="<p> </p>";
    document.title="divactif:" +divID;
    selectione= selection();
    documentFragment = selectione.extractContents(); 
    container.appendChild(documentFragment);
    selectione.insertNode(container);
    document.getElementById(divID).addEventListener("mouseup", function() {  document.title="divactif:" +divID;  });
    }
    //codescript;
     
    </script>
    le resultat en haut l'original
    en bas le resultat en ayant selectionner "un div stylé"

    Nom : Capture.JPG
Affichages : 281
Taille : 62,0 Ko
    si quelqu'un a une solution ? je suis preneur
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

  2. #2
    Membre Expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 910
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 910
    Par défaut
    Salut,

    Comment vas-tu depuis le temps ? Il est beau ton éditeur... C'est celui sur lequel tu bossais il y a quelques temps ?

    Le code que tu mets n'est pas complet, non ? Je demande ça car je ne vois où tu mets le style qu'on voit sur l'image...

    Sinon pour ta question, je vois deux points :

    1- une div est un block donc je pense pour éviter le retour à la ligne tu pourrais rajouter : container.style.display = "inline";...

    2- Le paragraphe est aussi un block donc je pense que cette instruction pose aussi problème : container.innerHTML = "<p> </p>";...

    Et je pense qu'elle n'est pas utile dans ton cas...

    Citation Envoyé par patricktoulon Voir le message
    ma fonction d'insertion d'un div englobant une selection fonctionne...
    Si c'est pour englober la sélection alors pourquoi fixer une taille à la div avec ces instructions : container.style.width = "200px"; container.style.height = "200px";... La taille de la div ou du moins sa largeur devrait être celle du texte sélectionné, non ?

  3. #3
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 374
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 374
    Billets dans le blog
    8
    Par défaut re
    Bonjour beguiner oui il y avait longtemps Meilleurs veux!!

    oui plus ou moins c'est le meme sauf que travaille toujours dans un userform en vba excel et que les fonctions vont etre apellées a partir de controls dans celui ci
    ca me permet d'avoir un form transportable sans etre accompagné de modules

    et oui j'y ai pensé au P dans le div forcément
    j'ymagine que le display in line est de rigeur pour le p parent je vais tester
    il va faloir que je fasse une boucle pour remonter au parent P et le mettre en inline c'est ca ?

    pour les style que tu ne vois pas c'est justement parce que c'est vba qui le fait

    exemple en vba
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    with actifelem.style:.border=" 1px solid black":.backgroundcolor="#ff0000":end with
    c'est ni plus ni moins que du dom

    le model que j'avais fait en html je l'ai toujours si tu le veux
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

  4. #4
    Membre Expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 910
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 910
    Par défaut
    Ben en fait le paragraphe tu n'en as pas besoin, la div suffit, non ?

    Sinon le display:inline c'est pour la div que tu insères, celle qui englobe la sélection, c'est-à-dire celle que tu as nommée "container" il me semble, c'est pourquoi je te disais que tu pourrais rajouter : container.style.display = "inline"; dans ta fonction...

    Mais j'ai peut-être mal compris ?

  5. #5
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 374
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 374
    Billets dans le blog
    8
    Par défaut re
    oui a la limite le div c'est pas grave son interieur mais c'est juste son alignement a son parent que je veux

    je viends de tester le"inline " ca ne fonctionne pas il n'y a plus de P dans le container pourtant

    demonstration(regarde bien le code obtenu j'ai un boutonpour ca) il est correcte pourtant (mesemble t il )
    Nom : demo2.gif
Affichages : 269
Taille : 737,2 Ko
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

  6. #6
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 209
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 209
    Par défaut
    Bonjour,
    il faut de temps en temps reprendre les spécifications, et les lire.

    Un élément <P> ne peut pas contenir un élément DIV et ce quelque soit son mode de rendu, inline, block ou autres... de plus la construction est invalide et le rendu par les navigateurs sera toujours le même :

    Ce code HTML
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <p>Un <div class="display: inline">deux </div>trois</p>
    donnera
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <p>Un </p><div class="display: inline">deux </div>trois<p></p>

    Pour un rendu à l'affichage uniquement ce code
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <p style="display:inline">Un <div style="display:inline">deux </div>trois</p>
    donnera
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <p style="display:inline">Un </p><div style="display:inline">deux </div>trois<p></p>
    cela reste NON CONFORME.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 6
    Dernier message: 12/10/2012, 11h16
  2. Concaténation dans une variable partagée par 2 fonctions
    Par Aiglon13 dans le forum Shell et commandes GNU
    Réponses: 6
    Dernier message: 23/05/2012, 09h36
  3. Réponses: 1
    Dernier message: 25/09/2009, 12h03
  4. Réponses: 6
    Dernier message: 29/07/2009, 15h31
  5. La fonction CurrentDb() ne fonctionne pas dans une requête
    Par Sébastien Le Goyet dans le forum Access
    Réponses: 8
    Dernier message: 24/11/2005, 17h46

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo