2016-08-08 39 views
2

Nachbildung, ich versuche, Vergleichstabelle aus vertikalen Listen zu erstellen. Hauptziel ist, dass die erste Spalte nur horizontal fixiert werden muss und die horizontale Bildlaufleiste immer auf dem Bildschirm sichtbar sein muss. Ich möchte einfach Reihen der ersten Spalte vergleichen mit entsprechenden Zeilen aus anderen Spaltenhorizontal fixed Spalte ist auf IE

wie hier jsfiddle example

Ich habe es geschafft, dies zu tun, indem Position absolut am 1. Spalte und seine CSS-Eigenschaft left auf Scroll-Ereignis zu ändern.

$('#container').scroll(function() { 
     $('#main').css('left', $(this).scrollLeft()); 
    }); 

Diese Lösung funktioniert gut außer IE. Auf IE ist meine feste Spalte nacheilend und wechselnde Position ist nicht glatt. Ich versuche es zu beheben, aber mir sind die Ideen für eine Lösung ausgegangen.

Antwort

0

Ein Teil des Problems könnte von der Tatsache herrühren, dass das Anhängen von irgendetwas an das Bildlaufereignis ziemlich schwer sein kann, indem man einfach eine console.log() anfügt, um die Anzahl der Aufrufe zu verstehen.
Sie sollten die in this thread vorgeschlagenen Lösungen ausprobieren, die es auf anderen Browsern abgesehen von IE sicher leichter machen werden.
Ich weiß, dass Sie nach Glätte suchen, Sie könnten die linke Eigenschaft animieren, anstatt sie sofort zu ändern, oder einen Weg finden, nur den fließenden Übergang auf IE zu machen, wie in den anderen Browsern.
Eine andere Sache, die Sie versuchen könnten, wäre Willenswechsel, aber leider wird es nicht von IE unterstützt. Sie könnten versuchen, transform: translate3D (0,0,0) zu #main zu geben, um den Browser dazu zu bringen, die Hardwarebeschleunigung zu verwenden, was die Leistung auf IE11 erhöhen könnte.

--edit andere Sache, die den Sinn kam:
Ich kann Ihnen positioniert, um das div haben absolut und nicht festen da müssen Sie nach unten scrollen, während halten es mit den anderen Tischen ausgerichtet sehen müssen . Könnten Sie nicht JS verwenden, um ihm Position zu geben: behoben, während horizontal scrollen und gehen Sie zurück zu absolute, wenn der Benutzer vertikal scrollt oder stoppt Scrollen horizontal?

+0

Ja, ich könnte aber, da geht neues Problem, weil das feste Element relativ zum Browser positioniert ist, nicht Elternelement. Und es wird auch ein Fenster mit Listen überlaufen. – Wiktor