Hallo Zusammen.
Ich denke zwar das dieses Thema schon öfter behandelt wurde, kämpfe mich aber seit Wochen durch das Forum und kann einfach keine Lösung für mein Problem finden.
Ich benutze den Black Pearl Style auf der neusten PhP3 Version mit Galerie und Portal Mod.
Mein Problem ist ganz einfach folgendes:
Ich habe als Header das Top Logo auf meinem 21' Lappi so vergrößert, das es bei mir sowohl auf dem Portal als auch später im Forum einwandfrei mittig und in der gewünschen Größe erscheint.
Problem ist jetzt natürlich das sich das ganze nicht automatisch an alle Rechner von Größe und mittigkeit anpasst.
Hintergrundbilder lassen sich ja nach meinen Rescherchen im Netzt nicht Variabel stellen.
Es muss doch aber eine Möglichkeit geben das so via Code einzustellen, das sich das Forum/Portal automatisch an alle Bildschirmaüflösungen anpasst. In anderen Foren funktioniert dies doch auch.
Es wäre super nett wenn mir jemand mitteilen könnte wo und wie ich den Code abändern muss um das gewünschte Ergebnis zu erzielen. Muss dies nun bei Black Pearl in der css, der overall_header oder sonst wo gemacht werden? Und wenn wie muüsste der Code aussehen?
Der Link zu meinem Board lautet: http://www.sturm-auf-die-bastille-festival.de/hq
Für Eure Hilfe wäre ich mehr als Dankbar.
Automatische Anpassung
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
- HabNurNeFrage
- Ehemaliges Teammitglied
- Beiträge: 1627
- Registriert: 17.01.2010 20:22
- Wohnort: An der Ostsee
- Kontaktdaten:
Re: Automatische Anpassung
Hi,
wie bereits richtig bemerkt, ist es nicht ganz einfach ein formatfüllendes Bild automatisch an die Fenstergröße anzupassen.
Ein Ansatz wäre JavaScript. Ist aber unschön und funktioniert auch nur bei aktivem Scripting des Clients.
Es handelt sich bei dem Logo aber nicht um einen CSS-Background, sondern um ein normal aufgerufenes Bild.
Dabei würde ich das Bild in der Breite von ungefähr 800 Pixeln abspeichern und mittig platzieren.
Eine automatische Anpassung der Größe erfolgt dabei aber nicht. Ist der Bildschirm kleiner, kommt der Scrollbalken.
Wenn man es als CSS-Background einfügt, kann man es mit CSS3 dem Viewport bzw. dem Container anpassen.
Hier kann man diese Funktionalität ausprobieren: http://www.w3schools.com/cssref/playit. ... round-size
Allerdings fällt für diesen Fall dann die Verlinkbarkeit mit der Startseite flach, sodass man dafür dann noch eine durchsichtige Grafik darüberlegen müsste, die dann verlinkt ist und die Sicht auf den Hintergrund trotzdem ermöglicht.
LG
wie bereits richtig bemerkt, ist es nicht ganz einfach ein formatfüllendes Bild automatisch an die Fenstergröße anzupassen.
Ein Ansatz wäre JavaScript. Ist aber unschön und funktioniert auch nur bei aktivem Scripting des Clients.
Es handelt sich bei dem Logo aber nicht um einen CSS-Background, sondern um ein normal aufgerufenes Bild.
Dabei würde ich das Bild in der Breite von ungefähr 800 Pixeln abspeichern und mittig platzieren.
Eine automatische Anpassung der Größe erfolgt dabei aber nicht. Ist der Bildschirm kleiner, kommt der Scrollbalken.
Wenn man es als CSS-Background einfügt, kann man es mit CSS3 dem Viewport bzw. dem Container anpassen.
Hier kann man diese Funktionalität ausprobieren: http://www.w3schools.com/cssref/playit. ... round-size
Allerdings fällt für diesen Fall dann die Verlinkbarkeit mit der Startseite flach, sodass man dafür dann noch eine durchsichtige Grafik darüberlegen müsste, die dann verlinkt ist und die Sicht auf den Hintergrund trotzdem ermöglicht.
LG
| HomeStory.org - the friendly Community | Forum für alle Lebenslagen | <"}))}~ | Nicht nachmachen: Meine phpBB Spielereien |
var shoppen = geld.replace (/geld/g, 'bloedsinn'); if (geld < 1) { return home; };
var shoppen = geld.replace (/geld/g, 'bloedsinn'); if (geld < 1) { return home; };
Re: Automatische Anpassung
Lies dir das mal durch viewtopic.php?p=1241992#p1241992
- Talk19zehn
- Ehemaliges Teammitglied
- Beiträge: 4943
- Registriert: 08.06.2009 12:03
- Kontaktdaten:
Re: Automatische Anpassung
Nun, das wird mit der jetzigen Grundgestaltung der Grafik jedoch schwierig, da sie Text enthält. Besser wäre es, die Texte bei Anwendung lt. Link dann separat einzubinden. Und ja, leider trifft man immer wieder auf "Breitbild-Grafiken", die auch noch Texte beinhalten.
In Anlehnung: reine Beispiele
http://www.ongray-design.de/forum/viewt ... =339#p2107
http://www.ongray-design.de/forum/viewt ... Logo#p2112
http://www.ongray-design.de/forum/viewt ... eline#p710
Ich komme rein rechnerisch für eine 800er-Auflösung auf rd. 740px in der Breite. Das Bild ist zwar 800px Breit, wird jedoch auf 1400px in der Breite skalliert, was ihr sicherlich gesehen hattet. Demnach müsste wohl zumindest mit einer kleineren Grafikgröße unter Beachtung der Seitenverhältnisse vorgegangen werden. Eine passende Hintergrundfarbe, die sich im Container an das Bild "anschmiegt" kann dabei sodann auch sehr hilfreich sein und suggerieren, dass die Grafik sich anpasst(e).
Evtl. hilft max-width ????? Bin mir bei dem Style jedoch unsicher .... leider ist´s mir nicht möglich alle CSS-Angaben mittels Firebug im Forum von Fenria zu untersuchen.
Viele Grüße
![Zwinkern :wink:](./images/smilies/icon_e_wink.gif)
In Anlehnung: reine Beispiele
http://www.ongray-design.de/forum/viewt ... =339#p2107
http://www.ongray-design.de/forum/viewt ... Logo#p2112
http://www.ongray-design.de/forum/viewt ... eline#p710
Ich komme rein rechnerisch für eine 800er-Auflösung auf rd. 740px in der Breite. Das Bild ist zwar 800px Breit, wird jedoch auf 1400px in der Breite skalliert, was ihr sicherlich gesehen hattet. Demnach müsste wohl zumindest mit einer kleineren Grafikgröße unter Beachtung der Seitenverhältnisse vorgegangen werden. Eine passende Hintergrundfarbe, die sich im Container an das Bild "anschmiegt" kann dabei sodann auch sehr hilfreich sein und suggerieren, dass die Grafik sich anpasst(e).
![Zwinkern :wink:](./images/smilies/icon_e_wink.gif)
Evtl. hilft max-width ????? Bin mir bei dem Style jedoch unsicher .... leider ist´s mir nicht möglich alle CSS-Angaben mittels Firebug im Forum von Fenria zu untersuchen.
![Traurig :(](./images/smilies/icon_e_sad.gif)
Viele Grüße
Re: Automatische Anpassung
Hier zur Vereinfachung mal die css. Kopiert aus Styles/Black_Pearl/theme/stylesheet.css
https://www.phpbb.de/support/pastebin.p ... iew&s=1288
Ich für meinen Teil resigniere langsam...Danke für Eure Hilfe
https://www.phpbb.de/support/pastebin.p ... iew&s=1288
Ich für meinen Teil resigniere langsam...Danke für Eure Hilfe
Zuletzt geändert von Crizzo am 30.06.2013 22:35, insgesamt 2-mal geändert.
Grund: Code in Pastebin ausgelagert! Bitte die Knigge beachten: https://www.phpbb.de/kb/knigge#code
Grund: Code in Pastebin ausgelagert! Bitte die Knigge beachten: https://www.phpbb.de/kb/knigge#code
Re: Automatische Anpassung
PS: Im Übrigen ist auch der Text in unserem Logo eine Grafik. Da beides, Sowohl Bild wie auch Text zu einer Grafik zusammengeführt wurden und erst dann als Bild/Logo in das Forum exportiert wurden via Styles/Black_Pearl/Imageset/sidelogo_smal.
- Talk19zehn
- Ehemaliges Teammitglied
- Beiträge: 4943
- Registriert: 08.06.2009 12:03
- Kontaktdaten:
Re: Automatische Anpassung
Ja, richtig:
Verkleinere deine Grafik sodann proportional ( Seitenverhältnis beachten ) und richte sie aus. Beachte kleinere Auflösungen, wenn du die Seite im Anschluss erneut betrachtest.
Link zum Style, zum entsprechenden Download gibt´s sicherlich? Stelle ihn doch bitte bereit. Danke.
LG
Edit:
Kann es zutreffend sein, dass du weitere CSS-Angaben eingebunden hast? Firebug zeigt mir nämlich nicht alle CSS-Konstrukte zum testen an. Das ist mir etwas suspekt, um direkte Hilfeansätze anzubieten.
Edit 2:
01.07.2013
Wie ich sehe, akallierst du die Grafik nun auf 800px in der Breite. Duch die Abstände reicht das jedoch für kleine Auflösungen noch nicht so ganz.
BTW:
W3C zeigt Fehlerchen, die du bereinigen solltest.![Zwinkern :wink:](./images/smilies/icon_e_wink.gif)
Hattest du dich mit all den Alternativen bereits befasst? Das ging ja fix. Und nichts passendes dabei? Okay....Fenria hat geschrieben:PS: Im Übrigen ist auch der Text in unserem Logo eine Grafik. Da beides, Sowohl Bild wie auch Text zu einer Grafik zusammengeführt wurden und erst dann als Bild/Logo in das Forum exportiert wurden via Styles/Black_Pearl/Imageset/sidelogo_smal.
Verkleinere deine Grafik sodann proportional ( Seitenverhältnis beachten ) und richte sie aus. Beachte kleinere Auflösungen, wenn du die Seite im Anschluss erneut betrachtest.
Link zum Style, zum entsprechenden Download gibt´s sicherlich? Stelle ihn doch bitte bereit. Danke.
LG
Edit:
Kann es zutreffend sein, dass du weitere CSS-Angaben eingebunden hast? Firebug zeigt mir nämlich nicht alle CSS-Konstrukte zum testen an. Das ist mir etwas suspekt, um direkte Hilfeansätze anzubieten.
Edit 2:
01.07.2013
Wie ich sehe, akallierst du die Grafik nun auf 800px in der Breite. Duch die Abstände reicht das jedoch für kleine Auflösungen noch nicht so ganz.
BTW:
W3C zeigt Fehlerchen, die du bereinigen solltest.
![Zwinkern :wink:](./images/smilies/icon_e_wink.gif)