Facebook Like-Taste verursacht horizontales Scrollen auf dem mobilen Gerät

8

Ich habe eine Facebook-Like-Button-Implementierung, die in allen Browsern Desktop und Mobile einwandfrei funktioniert. Die Probleme liegen jedoch bei Geräten mit niedriger Auflösung und einer Auflösung von 240 x 320. Der Like-Button bewirkt, dass das Gerät auf die Seite zoomt und somit horizontal scrollt.

Die Tasten werden auf Geräten mit einer Breite von> 320px wie dem iPhone usw. gut dargestellt, aber ältere Android-Geräte mit einer geringeren Breite sind mit Problemen konfrontiert.

So wie ich es sehe. Die Seite wird in Ordnung geladen, macht dann einen Server-Anruf bei Facebook und kehrt dann mit einem Parameter zurück, der alles auflöst. Es erzeugt ein <iframe> . Ich versuche, width und overflow CSS-Parameter zu setzen, aber keine scheint zu funktionieren. Ich initialisiere den Like-Button wie folgt:

%Vor%     
amit 16.12.2011, 13:14
quelle

7 Antworten

4

Keine der obigen Lösungen hat geholfen. Endlich die Antwort bekommen. Obwohl es nicht die beste Lösung ist, aber es erledigt die Arbeit.

Ich habe dies auf den übergeordneten Container der fb-Taste angewendet:

%Vor%     
amit 21.12.2011, 06:42
quelle
4

Setzen Sie Ihren like-Button in ein div und wenden Sie den versteckten Overflow-Stil auf dieses div an.
UDATE: Versuchen Sie auch, einen Überlauf im html- und body-Tag zu verbergen fb Seitenreiter).

Ein Code-Snippet, das Sie vielleicht auch nützlich finden, ist dies:

%Vor%     
borisdiakur 16.12.2011 13:31
quelle
3

Erkennen Sie ein Gerät mit niedriger Auflösung und verwenden Sie ein anderes Tastenlayout, das besser zu ihm passt.

Das ist:

%Vor%

würde allerdings etwas mehr vertikalen Platz benötigen, was gut ist.

  • button_count

  • box_count

    
DhruvPathak 20.12.2011 07:02
quelle
3

Facebook Like Button generiert automatisch einen iframe auf Ihrer Seite. Versuchen Sie die Breite, wenn der Iframe mit CSS oder dynamisch mit Javascript. Der iframe hat class="fb_ltr".

    
Kristoffer Svanmark 16.12.2011 13:21
quelle
2

Ich denke, der einzige Weg, dies zu lösen, ist die Verwendung eines benutzerdefinierten CSS für Ihre fblike-Schaltfläche

überprüfen Sie diese Links:

Benutzerdefinierte Skin für Facebook wie Schaltfläche Ссылка

    
juanjosezg 19.12.2011 09:57
quelle
2

Haben Sie andere normale Websites im selben Browser mit niedriger Auflösung überprüft? check twitter.com, wenn die Bildlaufleiste immer noch ein Problem im Browser ist (ich lief in etwas so), die Definition des Browsers Vollbild ist immer größer als die verfügbare Breite, ich musste schließlich ein "div" innerhalb definieren der Körper mit einer spezifischen Breite (320px) und lege den Inhalt darin ab, zusätzlich zum Überlaufen des Körpers: versteckt

    
Ayyash 20.12.2011 06:32
quelle
-2

Das war die einfachste Sache für mich, funktioniert auf iOS Safari, wenn Sie beide verwenden:

%Vor%     
Rich 16.06.2014 16:12
quelle