HTML/jQuery Tables: Przewiń poziomo, popraw pierwszą (lewą) kolumnę

Question

Mam tabelę, która wyświetla kolumnę nazw testowych, z kilkoma (nieograniczoną liczbą) kolumn różnych danych testowych związanych z testami. Ponieważ będzie kilka zestawów danych, chcę ograniczyć liczbę, która może być widoczna, i mieć możliwość przewijania w poziomie, aby pokazać/ukryć różne zestawy danych.

Przyjęta odpowiedź na Jquery table column sliding effect ma pewien rodzaj efektu ślizgowego, którego szukam, ale jak naprawić lewą kolumnę nazwisk? Jest dużo danych, więc nie chcę klonować dwóch tabel, jak sugerowano gdzie indziej w Internecie.

Utworzenie jednej stałej tabeli dla nazw i jednej przewijanej tabeli dla wyników danych zostało zakończone, ale wysokość wiersza jest zmienna na podstawie ilości otrzymanych danych (w komórce może znajdować się kilka wierszy tekstu), więc wyrównanie zostaje wyrzucony.

Ponadto nie chcę domyślnego paska przewijania w Internecie. Mam obrazy lewej/prawej strzałki, które będę używać do kontrolowania przewijania, podobnie jak przykład, który napisałem powyżej.

Spędziłem około 4 godzin patrząc na StackOverflow i resztę Internetu dla odpowiedzi, ale nie znalazłem nic odpowiedniego jeszcze ... każda pomoc byłaby doceniona, dziękuję!

Edytuj: Położenie bezwzględne w lewej kolumnie powoduje przesunięcie stołu w lewo pod lewą kolumną (ukrywanie pierwszej kolumny danych). Dodanie kolumny "lustro" o tej samej treści co pierwsza kolumna działa dobrze; Problem polega na tym, że gdy kolumny danych mają komórki, które są wyższe niż odpowiadające im komórki nazw, komórka z bezwzględną pozycją nie może zobaczyć tego faktu i zmienić jego wielkość. Myśli?

Answer 1

Wyliczyłem, że coś, co działa z tabele, jak prosiłem. To, co powiedziałem wcześniej o tworzeniu jednego stałego stołu i jednej przewijanej tabeli, działa z pewną modyfikacją:

Zachowałem mój oryginalny stół z nazwami testowymi i danymi i umieściłem je w przewijanym oknie. Potem stworzyłem kolejną tabelę, która miała tylko lewą kolumnę i umieściła ją absolutnie ponad domyślną pozycją lewej kolumny w przewijanym stole. Następnie używam jQuery, aby zmienić rozmiar pojedynczych komórek w kolumnie, aby pasowały do ​​wysokości zmiennych w komórkach danych (jeśli komórki nazw są wyższe, komórki danych nadal otrzymują te dane ze zduplikowanej kolumny).

Posiadam również tablicę szerokości kolumn. Kiedy klikam lewy lub prawy przycisk przewijania, przewijam tabelę o wymaganą wartość tablicy i zwiększam/zmniejszam indeks tablicy.

Nie publikuję kodu, ponieważ nie chcę przepisywać i formatować przykładu, ale jeśli masz pytania, jak to zrobić, możesz poprosić. =)

Answer 2

Udało mi się ustawić pierwszą kolumnę, a pozostałe przesunęły się pod drugą kolumną: http://jsfiddle.net/Skooljester/trFPD/1/ Spróbuję teraz popracować nad pozostałymi częściami twojego pytania.