"Erweitere" Webseiten auf eine klebrige Fußzeile

Ich baue ein Plugin, das eine HTML iframe "Symbolleiste" am Ende jeder Webseite einfügt. Ich habe „sticky Footer“ Verhalten erreicht durch Injizieren der folgende:"Erweitere" Webseiten auf eine klebrige Fußzeile

<iframe frameborder="0" noresize="noresize" src="http://example.com/toolbar.html" style="position:fixed; background:transparent; width:100%; height: 33px; padding:0; bottom: 0px; z-index: 2px;"></iframe>

jedoch diese iframe überlappt die unteren 30 Pixel einer Webseite. Was ich suche, ist, wie man jede Webseite 30 Pixel "erweitert", so dass unsere Leiste das ganze Verhalten einer klebrigen Fußzeile hat (sie ist immer am unteren Bildschirmrand vorhanden), aber ein Benutzer kann immer noch nach unten scrollen einer Website und sehen Sie den untersten Inhalt dieser Website. (Ohne traditionellen Rahmen zu verwenden, die andere Probleme verursacht haben.)

Zusätzliche Informationen

Stumble Upon for Chrome dieses Verhalten am oberen Rand des Fensters hat erreichen (dh die Stumble Upon Bar „schiebt“ Inhalt nach unten statt überlappend.)

Quelle

2010-11-26 Kyle

Interessante Frage, aber wenn Chrome selbst einige Tricks nicht unterstützt, die eine Erweiterung das Fensterlayout ändern lassen, sehe ich nicht, wie das gemacht werden kann, und zumindest wenn Sie erwarten, dass es * immer * funktioniert. Viele Layouts erwarten eine vollständige Kontrolle über den Tag "". – Pointy

können Sie Margin-Top zu 33px? Ich weiß, Iframes sind ein Schmerz zu stylen ... – billythekid

~~Ich würde eine padding-bottom:33px dem Körper hinzufügen.~~

Update

Die obige Antwort wird nicht funktionieren, wenn beide html und body Tags height:100%;

Lösung

haben Kratzer auf der Körpertechnik und tun.

html{ 
    height:auto!important; 
    height:100%; 
    min-height:100%; 
    padding-bottom:33px; 
}

Ich kann nicht an ein Szenario denken, wo dies etwas durcheinander bringen würde.

Quelle

2010-11-26 20:48:02

Würde das nicht nur eine 33px Padding an den unteren Rand des Inhalts, nicht das Fenster hinzufügen? Ich mag mich hier irren, aber will das OP nicht, dass eine 'Stange' an der Unterseite des Fensters klebt? – Bojangles

@Jam, das OP hat 'position: fixed',' height: 33px' und 'bottom: 0px' für den iframe verwendet, so dass es immer am unteren Rand des Fensters hängen bleibt. Wenn wir 'padding-bottom: 33px' zum' body' hinzufügen, geben wir ihm 33 weitere Scrollpixel, wodurch der Inhalt, der durch die Werkzeugleiste ausgeblendet wurde, sichtbar wird. Denn unter der Symbolleiste werden jetzt die 33 Pixel Padding angezeigt. –

@Gaby, danke für deine Antwort! Du hast recht mit 'Höhe: 100%' ... Ich würde gerne hören, ob es auch eine Lösung dafür gibt. – Kyle

"Erweitere" Webseiten auf eine klebrige Fußzeile

Antwort

Verwandte Themen