HTML - /CSS-Code für Twitter-widget width
Den code Twitter gibt Sie fügen Sie ihn in den html sieht wie folgt aus:
<a class="twitter-timeline" href="https://twitter.com/username" data-widget-id="248169276782018560">Tweets by @username</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
Sie können Sie in einer Höhe, die ich um 600. Bei der Platzierung auf meiner Website bekomme ich diese (wenn die Anzeige der Quelle):
<iframe id="twitter-widget-6" classname="twitter-timeline twitter-timeline-rendered" scrolling="no" frameborder="0" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; " width="220" height="600"></iframe>
220 Breite ist das, was ist, mich zu töten. Ich möchte die Breite auf die volle Breite des Containers ein, die ist 100% für eine mobile Website). Die derzeit 220 Breite geht ein wenig mehr als halb über die Seite und zeigt eine hässliche scrollbar.
Also, warum ist es die Einstellung der Breite auf 220, und wie kann ich es ausbauen, um es den Eltern Breite?
InformationsquelleAutor tariq | 2012-09-21
Schreibe einen Kommentar Antworten abbrechen
Du musst angemeldet sein, um einen Kommentar abzugeben.
Ich nutze ein responsive theme und dieser css-code funktioniert einwandfrei. Dank Hjuster.
Twitter ermöglicht es Ihnen, passen Sie die Breite und Höhe des timeline-widget per HTML-Attribute width und height, ABER die minimale Breite, die Sie akzeptieren, ist
220 pixels
BEISPIEL:width="220"
,height="350"
VOM Twitters Entwickler-Seite: Die minimale Breite der timeline ist 220px, und die maximale ist 520px. Die minimale Höhe beträgt 350px.
Ändern Sie können die Breite des widgets, indem Sie seinen Wert in der "twitter-timeline" class definition, wie Sie hier erwähnt:
https://dev.twitter.com/docs/embedded-timelines
Beispielsweise eine twitter-timeline-widget mit einer Breite 280 und Höhe 300 ist etwas entlang der Linien von:
Den oben genannten Werken, die ich vermute, die zahlen entsprechen, wie viele widgets, die Sie erstellt haben.
Ist die Breite das einzige, was wir ändern können, was über Schriften, I cant scheint, dies zu ändern?
Das Twitter-widget ist so hässlich, es ist schwer, machen Sie es sich schön in jedes layout.
wenn Sie nur
es funktionieren wird, aber es wird abgeschnitten die auf iOS-Geräten (noch nicht getestet auf android).
Um dies zu beheben, müssen Sie die Breite und Höhe, um die twitter-timeline zum tag folgendermaßen:
<a>
tag zu arbeiten.Wenn wir unten CSS, dann können wir die Breite des widgets entsprechend der Anforderung.
Ich brauchte, um die Klasse zu verwenden, die twitter-timeline gerendert statt der id #twitter-widget-0. So, das widget in der Größe geändert wird nach dem Rendern.
Gehören
in der Anker-tags. Dies funktioniert für mich.
Versuchen
width="220"
zuwidth="100%"
.Dieser arbeitete für mich...
.timeline{max-width:520px;
max Breite. Also der iframe wird 600 px Breite, aber im iframe wird der Inhalt 520px Breite. Durch überladen der Stil direkt im iframe, Sie neu zu definieren timeline-Klasse ist, und Sie können gehen Sie über den 520 px beschränken.Diese funktioniert bei mir:
Ich habe versucht, alle oben genannten Antworten aber kein Glück,
So Umgesetzt code unten mir und für mich gearbeitet
Hier ist, wie ich es Tat, mit fast der gleichen Logik als Chandrakant hat verwenden Sie zum einfügen des Stils in den iframe.
Erstens: fügen Sie twitter-widget den richtigen Weg
Jetzt haben Sie ein schönes Fenster.twttr._e-array enthalten können alles, was, die ausgeführt wird, sobald twitter widget.js ist geladen.
Beachten Sie, dass ich Hinzugefügt js.async = true;
Nun können Sie in ein und demselben Skript oder danach tun:
Beachten Sie, dass ich verwendet die jquery-Weg zum Anhängen der Stil am Ende des iframe-head-Inhalt". Kann man den klassischen Weg, aber es ist mehr.
Mit dem letzten update (oder Schraube) twitter sind gezwungen, alle feed-widgets zum anzeigen von Bildern automatisch auf zu laden, egal, welche Optionen gesetzt sind, innerhalb der twitter-Einstellungen.
Jetzt bin ich mit Ihrer eigenen widget-feed in eine html-basierte Website und möchten, deaktivieren Sie die Bilder aus dem laden. Ich bin nicht dagegen, mit zu beginnen, und aber könnte jemand mir raten, wo könnte ich Sie finden, eine anpassbare html-und js-basierte twitter-feed, nicht auf Bilder.