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 :

Figer l'entête d'un tableau


Sujet :

JavaScript

  1. #1
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    6
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 6
    Points : 6
    Points
    6
    Par défaut Figer l'entête d'un tableau
    Bonjour,
    j'arrive à figer l'entête d'un tableau en CSS quand mon entête n'a qu'une seule ligne, problème je cherche à afficher une liste de produit avec leur tarif à l'achat et à la vente du coup j'ai un entête sur 2 lignes ce qui donne à peut-prêt :
    POUR L'ENTETE :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    <tr>
    <th colspan="3">ACHAT<th>
    <th colspan="3">VENTE</th>
    </tr>
    <tr>
    <th>Produit</th>
    <th>PA HT</th>
    <th>%remise</th>
    <th>PV HT</th>
    <th>%remise</th>
    <th></th>
    </tr>
    et un détail du type
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    <!-- Ligne de rupture par rayon -->
    <tr>
    <td colspan="6">Rayon 1</td>
    </tr>
    <tr>
    <td>BRPRO001 - Exemple de produit</td>
    <td>12.76</td>
    <td>7.9</td>
    <td>27.23</td>
    <td>10</td>
    <td><input type="checkbox"></td>
    </tr>
    Une idée ???

    PS : je suis blond (châtain) et con également sur certains sujet, mais sur d'autre où j'excelle je me montre tolérant avec les novices, après tout on a pas tous la science infuse, partageons nos connaissances !

  2. #2
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    6
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 6
    Points : 6
    Points
    6
    Par défaut Une première astuce avec Jquery
    trouvée sur ce lien :

    http://www.david-michel.fr/developpe...n-tableau.html

    problème, ça fonctionne sur Firefox et sur IE, à partir de la v9, manque de bol mon client est sur IE6 ou 7.

  3. #3
    Modérateur

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

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 075
    Points : 44 657
    Points
    44 657
    Par défaut
    Bonjour,
    visiblement ce n'est pas une solution pure CSS que tu cherches, il te faudra donc effectivement t'orienter vers le javascript.

    Il me semble qu'un post en à parlé il y a peu d'ailleurs.

    PS : je déplace dans le forum javascript

  4. #4
    Nouveau Candidat au Club
    Profil pro
    Inscrit en
    Février 2012
    Messages
    1
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2012
    Messages : 1
    Points : 1
    Points
    1
    Par défaut
    Citation Envoyé par juccuj Voir le message
    trouvée sur ce lien :

    http://www.david-michel.fr/developpe...n-tableau.html

    problème, ça fonctionne sur Firefox et sur IE, à partir de la v9, manque de bol mon client est sur IE6 ou 7.
    le système connait effectivement des soucis sur les anciens navigateurs mais j'ai trouvé la solution au travail ( je voulais utiliser mon tuto mais je devais fixer plusieurs lignes et etre compatible partout)

    la solution est d'utiliser du javascript et jquery et de créer deux fois la zone fixe.

    celle visible au debut qui montera et sera caché par une deuxiéme en position fixed en haut entouré des zones blanches ( que j'appellerais #box : ca sera aussi son id).

    je te donne un exemple pour le gérer :

    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
    23
    24
    function divdur() {
        $("#box").css('display', 'none');
     
        var bodyY = 350;
        originalX = $('#box').css('margin-left');
     
        $(window).scroll(function () {
            var scrollY = $(window).scrollTop();
            var isfixed = $('#box').css('position') == 'fixed';
     
            if (scrollY > bodyY && !isfixed) {
                $('#box').stop().css({
                    position: 'fixed',
                    left: '50%',
                    top: 0,
                    marginLeft: -469
                });
                $("#box").fadeIn();
            } else if (scrollY < bodyY && isfixed) {
     
                $("#box").fadeOut(callbackFadeOut);
            }
        });
    }

Discussions similaires

  1. [MySQL] Figer l'entête d'un tableau
    Par cheik_koita dans le forum PHP & Base de données
    Réponses: 5
    Dernier message: 19/03/2009, 13h36
  2. Fixer l'entête d'un tableau
    Par Immobilis dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 10/06/2006, 18h02
  3. Figer l'entête d'un formulaire
    Par sylvia94 dans le forum Access
    Réponses: 4
    Dernier message: 10/05/2006, 16h22
  4. [CSS] Figer l'entete d'un tableau
    Par Silvia12 dans le forum Mise en page CSS
    Réponses: 6
    Dernier message: 02/08/2005, 11h46

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