Grafiken/Sprites für dynamische Textfeldgröße?

[Karlo]

Hallo,

Ich arbeite an einem WP Theme das ich für meinen Blog nutzen möchte...

Ich habe da eine bestimmte Idee ich, hab mir in da mal was zusammengebaut wie das aussehen soll:

http://s1.directupload.net/images/130327/qqrmxw4b.png

In dem Fernsehen werden Videos eingebettet und unten drunter will ich den Text anzeigen lassen und weiterführende Links ect.

In dem Regal ist aber nur relativ wenig Platz für Text und ich habe überlegt wie man das ändern könnte.

Ich dachte daran das Regal in verschiedene Teile zu schneiden (oben, Seiten, Boden) dann als sprite abzuspeichern und das ganze dann dynamisch aufzurufen, je nach Text Länge, also beginnend mit einem Stück von oben, dann entsprechend der Textlänge genügend (aber nicht zu viele) Mittelteile und zum Abschluss das Endstück.

Hat jemand eine Idee oder kennt eine Technik die man hier anwenden könnte? Ist das Überhaupt möglich?

[Matthias Apsel]

Om nah hoo pez nyeetz, Karlo!

Ich dachte daran das Regal in verschiedene Teile zu schneiden (oben, Seiten, Boden) dann als sprite abzuspeichern und das ganze dann dynamisch aufzurufen, je nach Text Länge, also beginnend mit einem Stück von oben, dann entsprechend der Textlänge genügend (aber nicht zu viele) Mittelteile und zum Abschluss das Endstück.

Sprites sind vordergründig eine Technik für Hintergrundgrafiken. So wie du das beschreibst, wird das also nichts. Du könntest aber auf multiple Hintergrundgrafiken ausweichen.

<p>Hier der weiterführende Text...</p>  

p { background-image: url(oben.png), url(links.png), url(rechts.png), url(unten.png) }  

Eine Übersicht über CSS-Eigenschaften gibt es im Wiki, eine Seite, die die Verwendung zeigt bei mir.

Matthias

[Karlos]

Sprites sind vordergründig eine Technik für Hintergrundgrafiken. So wie du das beschreibst, wird das also nichts. Du könntest aber auf multiple Hintergrundgrafiken ausweichen.

Die Bilder im Screenshot sind auch Hintergrundgrafiken für bestimmte divs.

<p>Hier der weiterführende Text...</p>

> ~~~css

p { background-image: url(oben.png), url(links.png), url(rechts.png), url(unten.png) }  

> 

Eine Übersicht über CSS-Eigenschaften gibt es im Wiki, eine Seite, die die Verwendung zeigt bei mir.

Matthias

Also ich müsste 3 divs erstellen wenn ich dich richtig verstehe: oben, unten, Mitte, oben und unten müssen fest sein und die Mitte mach ich Riesen groß/lang aber zeig dann nur einen bestimmten Ausschnitt?

[Matthias Apsel]

Om nah hoo pez nyeetz, Karlos!

Also ich müsste 3 divs erstellen wenn ich dich richtig verstehe: oben, unten, Mitte, oben und unten müssen fest sein und die Mitte mach ich Riesen groß/lang aber zeig dann nur einen bestimmten Ausschnitt?

maximal ein div, besser wäre ein semantisch passendes Element. Für dieses verwendest du multiple Hintergründe. Literatur dazu hab ich dir bereits verlinkt.

Matthias

[Karlo]

maximal ein div, besser wäre ein semantisch passendes Element. Für dieses verwendest du multiple Hintergründe. Literatur dazu hab ich dir bereits verlinkt.

Matthias

Aber dafür müsste ich doch Wissen wie Gross der Text ist um das dann dynamisch an die CSS zu übergeben... Der Textinhalt kann ja varieren und unterschiedlich lang sein für jeden Blogpost.

[Matthias Apsel]

Om nah hoo pez nyeetz, Karlo!

Aber dafür müsste ich doch Wissen wie Gross der Text ist

Nein. Du musst dafür sorgen, dass die linke unnd rechte Grafik in solche Kacheln geteilt ist, dass die Wiederholungen nicht auffallen (was ja auch deine ursprüngliche Idee war). Den Rest macht background-repeat in Verbindung mit der korrekten Stapelreihenfolge der Hintergrundgrafiken.

Matthias