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 :

Agrandir la hauteur d'une DIV en fonction d'une donnée textuelle ou d'un attribut non conventionnel


Sujet :

JavaScript

Mode arborescent

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Invité
    Invité(e)
    Par défaut Agrandir la hauteur d'une DIV en fonction d'une donnée textuelle ou d'un attribut non conventionnel
    bonjour,

    pour améliorer un système, j'ai l'occasion de placer un script JS dans le document ready pour modifier les propriétés des élements affichés.

    mon souci :
    le rendu d'une page contient une multitude d'élements DIV comme ça (en gros ce rectangle qui représentent des missions ,des cours....) :

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    <div class="boite">
    <div class="groupedate">2020-10-20 : HR/SCIENCE</div>
    <div class="horaire">08:50-10:20</div>
    <div class="matiere">Maîtrise de la bio</div>
    <div class="prof">holeg</div>
    <div class="salle">Tour perret</div>
    <div class="txt">HR/SCIENCE=marc,sophie,jackie</div>
    </div>

    Toutes les div de class boite ont la même hauteur et c'est un problème de compréhension visuel pour bcp de gens, et donc je voudrais que cette hauteur soit proportionnelle à la durée.

    Notre prestataire nous dit qu'il a la possibilité de rajouter un attribut dans le DIV HORAIRE avec la durée en minutes pour que nous ayons ceci (noubeauté ligne 3) :

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    <div class="boite">
    <div class="groupedate">2020-10-20 : HR/SCIENCE</div>
    <div class="horaire" duree=90>08:50-10:20</div>
    <div class="matiere">Maîtrise de la bio</div>
    <div class="prof">holeg</div>
    <div class="salle">Tour perret</div>
    <div class="txt">HR/SCIENCE=marc,sophie,jackie</div>
    </div>

    Problème cette demande est payante par le prestataire...

    mon idée est de savoir si on peut faire sans ou pas OU si on laisse le presta ajouter l'attribut DUREE, est-ce que ce sera utile pour nous sachant que l'attribut DUREE n'est pas une norme du w3c pour un champs div ! (peut-être créateur de bug)

    Est-ce que en jquery ou simplement JS, je pourrais capter pour CHAQUE div, cette valeur duree ET ensuite allonger le div (sa height) en fonction de la valeur ?

    j'ai pensé à ça (écritue expérimentale car la partie en italic, je sais pas comment l'écrire:
    $(".boite").css('height', _self.attr( 'duree' ));
    // je sélectionne tous les objets div de class boite et pour chacun, je change la height en fonction de l'attribut de chacun

    est-ce que c'est possible sans la modif du presta ? donc récuper le contenu html du div horaire, en déduire une durée ET ensuite mettre cette durée dans le div boite parent ?
    ou faut-il obligatoirement l'attribut 'duree' mais qui n'est pas conventionnel du tout (et payant à faire mettre)

    est-ce que ma ligne de code peut marcher ou dois-je faire un truc avec un for each ?

    Je rappelle que je n'ai la main que sur la parti js du document ready, je ne peux pas "regénérer" le contenu html (rôle du prestataire)

    merci de vos conseils
    Dernière modification par ProgElecT ; 20/10/2020 à 19h11. Motif: S'il vous plaît, pas d'autres balises dans votre code, indiquez le N° de ligne ou vous voulez attirer l'attention

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

Discussions similaires

  1. Hauteur d'une DIV en fonction d'une autre DIV via JavaScript
    Par friendofweb dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 02/09/2015, 10h58
  2. Hauteur d'une DIV en fonction d'une autre DIV
    Par philippef dans le forum Mise en page CSS
    Réponses: 11
    Dernier message: 01/09/2015, 18h30
  3. Réponses: 3
    Dernier message: 13/11/2012, 16h56
  4. [POO] Agrandir la hauteur d'un div en javascript ?
    Par deloo dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 31/10/2006, 09h15
  5. hauteur d une balise div en fonction de la résolution
    Par echecetmat dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 25/01/2005, 10h51

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