2014-04-30 10 views
5

Ich habe die Richtlinien für die Unterstützung von mobilen Browsern befolgt, indem ich den Inhalt hinter und hinter den body-Tags eingefügt habe.Wie repariere ich Skrollr auf Mobile?

explination ist hier: https://github.com/Prinzhorn/skrollr#what-you-need-in-order-to-support-mobile-browsers

Die Seite befindet sich noch pflegt die Seite erlauben jedoch auf einem iPad zu blättern. Ich bin mir nicht sicher warum. Jedes Code-Detektiv würde sehr geschätzt werden.

Website mit dem Code ist http://bit.ly/1rr6zGA

+0

Die Seite, die Sie verlinkt haben, enthält kein 'skrollr-body' Element – Prinzhorn

Antwort

11

Sie müssen mit der ID skrollr-body alle Ihre Inhalte in einem Element Wrapp. Alle Elemente, die nicht Position sind: fixiert; in Ihrem css geht in das skrollr-body Element.

From Skrollr website:

Beginnend mit skrollr 0.6.0 es gibt nur eine Sache, die Sie tun müssen: Fügen Sie ein Element auf Ihrer Seite mit der ID skrollr-Körper. Das ist das Element, das wir bewegen, um Scrollen zu fälschen. Der einzige Fall, in dem Sie keinen # skollr-body benötigen, ist bei Verwendung von position: fixed exclusive. Tatsächlich enthält die skrollr-Website kein # skrollr-body-Element. Wenn Sie sowohl feste als auch nicht fixierte (d. H. Statische) Elemente benötigen, legen Sie die statischen Elemente in das Element # skrollr-body.

Oder anders gesagt: Auf Mobilgeräten wird das skollr-body-Element mit CSS-Transformationen verschoben. Sie können nicht position: fixed oder background-attachment: fixed innerhalb von Elementen, die CSS-Transformationen gemäß CSS-Spezifikation verwenden (http://meyerweb.com/eric/thoughts/2011/09/12/un-fixing-fixed-elements-with-css-transforms/). Deshalb müssen diese Elemente außerhalb des skollr-body-Elements sein.

+2

Sie sagen, Sie müssen alle Ihre Inhalte in # skrollr-Körper" wickeln ". aber auf der Website heißt es "Ein Element auf Ihrer Seite mit der ID skrollr-body einbeziehen", es heißt nicht "wrap". Ich würde denken, nur ein leeres # skrollr-bodydiv irgendwo, aber Ill versuchen, alle meine Inhalte in # skrollr-Körper wickeln, weil Ihr Weg glaubhafter klingt –

+0

Also jede Webseite mit einem festen Nav kann nicht mit Skollr auf dem Handy arbeiten. – BenRacicot

+0

@BenRacicot Ich bin mir nicht sicher, ob das stimmt. Es ist möglich, ein festes Navigationsgerät zu verwenden, solange es nicht vom # skrollr-body-Element umschlossen ist. Ich habe Fälle gesehen, in denen das Nav über dem Rest des Skollring-Teils sitzt – colmjude

3

Ich kann bestätigen, dass Sie den Inhalt, den Sie scrollen möchten, in # skrollr-body umbrechen müssen. Das Hinzufügen eines div mit id = skrollr-body funktioniert nicht. Meine Seite würde sonst nicht auf Mobilgeräten blättern.

Verwandte Themen