HTML/jQuery Tables: Défilement horizontal, fixer le premier (à gauche) de la colonne
J'ai une table qui affiche une colonne de noms de test, avec plusieurs (nombre illimité) des colonnes de différentes données de test associés avec les tests. Car il y aura plusieurs jeux de données, je veux limiter le nombre qui peut être vu, et demandez à l'utilisateur d'être en mesure de faire défiler horizontalement pour afficher/masquer les différents ensembles de données.
La accepté de répondre à Jquery colonne de la table coulissante effet a la sorte de glissement de l'effet que je recherche, mais comment faites-vous pour régler la colonne la plus à gauche des noms? Il y a beaucoup de données donc je ne veux pas de cloner les deux tableaux, comme cela a été suggéré ailleurs sur Internet.
La création d'une table fixe pour les noms et un défilement de table pour les résultats des données est venu près, mais la hauteur de ligne est variable sur la quantité de données reçues (il peut y avoir plusieurs lignes de texte dans une cellule), de sorte que l'alignement obtient jeté hors tension.
Aussi, je ne veux pas d'un Internet par défaut de la barre de défilement. J'ai flèche gauche/droite des images que je vais utiliser pour contrôler le défilement, à l'instar de l'exemple que j'ai posté ci-dessus.
J'ai passé environ 4 heures de recherche sur StackOverflow et le reste de l'Internet pour obtenir des réponses, mais je n'ai pas trouvé quoi que ce soit approprié... toute aide serait appréciée, merci!
Edit: positionnement Absolu, la colonne de gauche des résultats dans le reste de la table décalage à gauche en dessous de la colonne de gauche (en cachant la première colonne de données). L'ajout d'un "miroir" de la colonne avec le même contenu que la première colonne œuvres d'accord; le problème est que lorsque les données des colonnes ont des cellules qui sont plus haut que le nom correspondant cellules, l'absolu placé le nom de la cellule ne peut pas voir ce fait et de le redimensionner. Pensées?
OriginalL'auteur craftsycandymonster | 2011-08-11
Vous devez vous connecter pour publier un commentaire.
J'ai réussi à faire la première colonne fixe, de demander aux autres de glisser sous, et la deuxième colonne spectacle: http://jsfiddle.net/Skooljester/trFPD/1/ je vais essayer de travailler sur les autres parties de votre question maintenant.
OriginalL'auteur jezza-tan
Trouvé quelque chose qui fonctionne avec tables, comme je l'ai demandé. Ce que j'ai dit avant sur la création d'une table fixe et un défilement de table fonctionne avec quelques modifications:
J'ai gardé mon premier tableau avec les noms de tests et de données, et l'a mis dans une fenêtre de défilement. Puis j'ai créé une autre table qui n'avait que la colonne de gauche et l'a placé absolument sur la position par défaut de la colonne de gauche dans le défilement de la table. J'ai ensuite utiliser jQuery pour redimensionner la colonne unique cellules pour correspondre à la variable de la hauteur des cellules de données (si le nom de cellules sont plus grands, les cellules de données toujours recevoir des données à partir de la copie de la colonne).
Je garde aussi un tableau de la largeur des colonnes. Quand je clique sur la gauche ou sur la touche de défilement de droite, je défiler la table au cours de la matrice de valeur, et incrémenter/décrémenter le tableau d'index.
Pas poster du code, car je ne veux pas réécrire et format un exemple, mais si vous avez des questions sur la façon de le faire, n'hésitez pas à demander. =)
OriginalL'auteur craftsycandymonster