2012-12-15 11 views
8

Beispielcode hier: http://pastebin.com/95z3pftQhorizontales Scrollen nicht mit width = device-width iscroll

Ich versuche, eine Mobile-Seite mit einem festen Header bauen, und ein „Inhalt“ Abschnitt, die externen gefüllt wird (hygienisiert, aber ansonsten beliebig) HTML. Ich brauche iscroll oder etwas ähnliches, weil ich vertikales/horizontales Scrollen und das Zoomen unterstützen muss, das kein gebürtiges Äquivalent hat. Das Problem besteht darin, dass mobile Safari mit der Viewport-Direktive width=device-width alle Elemente auf Blockebene auf die Bildschirmbreite skaliert, unabhängig von der Breite ihres Inhalts, es sei denn, sie haben eine Breite angegeben. iscroll schaut sich dann die Breite des Containers an (was die Breite des Bildschirms ist) und ist sich nicht bewusst, dass es mehr Inhalt gibt, um horizontal zu scrollen. Also in diesem Beispiel ist die berechnete Breite für div#container auf meinem iPhone 290px, aber die berechnete Breite für table#really-wide-content ist 1000px.

Gibt es etwas, um die Auswirkungen der Meta-Viewport-Direktive innerhalb eines div auf der Seite zu deaktivieren? Beachten Sie, dass ich nicht a priori wissen kann, wie breit der Inhalt ist oder wie seine HTML-Struktur aussieht, obwohl ich Inline-Stile bei Bedarf programmatisch ändern kann.

Antwort

0

Können Sie setzen die Breite iScroll an einem gewissen Punkt nach der Last, wie dieses JQuery Beispiel:

$('#scroller').width(your_width); 

über https://stackoverflow.com/a/13898458/1085891

Gibt es trotzdem kann man zerstören und neu iScroll nachdem die Seite geladen wurde wie hier vorgeschlagen: How to set dynamic width in iScroll for scroller?

Können Sie die Breite des Darstellungsbereichs auch nach dem Laden auf width=device-width einstellen? Vielleicht würde dies erlauben, dass iScroll zuerst den Inhalt aufnimmt.

+2

Ich stellte am Ende die Breite des Elements direkt, obwohl diese Lösung sauberer sein kann. Ich kenne nicht die Breite a priori (die Ursache des Problems), aber ich habe später über element.scrollWidth gelernt. https://developer.mozilla.org/en-US/docs/DOM/element.scrollWidth – RecursivelyIronic

+0

Haben Sie dann eine funktionierende Lösung gefunden? – JSuar

+1

Ja. scrollWidth war genau das, wonach ich suchte. – RecursivelyIronic