Christian Walgenbach: Verlauf in einem Div

Hallo,

unter http:\\lino16.dyndns.org\projekt01 ist mein aktuelles Projekt zu sehen.

Ich möchte innerhalb der Linkliste (DIV) einen Verlauf erzeugen.
Kann man dies mit einem CSS-Effekt oder besser per Image?
Wenn per Image, wie binde ich diese am Besten ein?

Vielen Dank schon im Voraus.

by Christian

  1. Hallo,

    unter http:\\lino16.dyndns.org\projekt01

    **                 *

    Slashes, keine Backslashes: http://lino16.dyndns.org/projekt01

    Ich möchte innerhalb der Linkliste (DIV) einen Verlauf erzeugen.
    Kann man dies mit einem CSS-Effekt oder besser per Image?
    Wenn per Image, wie binde ich diese am Besten ein?

    Eine Grafik mit einem Verlauf, die dann in einer fixen Position und mit einem bestimmten Repeat (x oder y) eingebunden wird.

    z.B. div { background: #FFF url(verlauf.jpg) bottom fixed repeat-x; }

    Gruß
    Lachgas

    --
    Keine Verbesserung ist zu klein oder geringfügig, als dass man sie nicht durchführen sollte. (Adorno)
    1. Hallo,

      Eine Grafik mit einem Verlauf, die dann in einer fixen Position und mit einem bestimmten Repeat (x oder y) eingebunden wird.
      z.B. div { background: #FFF url(verlauf.jpg) bottom fixed repeat-x; }

      Das klappt soweit, aber hat einen Nachteil: Die Breite (bzw Höhe, kommt auf die Verlaufsrichtung an) des Verlaufs ist von vornherin durch die Maße des Images bestimmt. Wenn du lieber einen Verlauf über das komplette div haben möchtest, sollte dein Image die Maße des divs haben.
      Noch eleganter wird das Ganze, wenn du ein Image mit dem Verlauf erstellst, das etwa doppelt so breit (oder hoch) ist, wie das div und dieses dann mit width einschränkst. Das heisst, hinter den Menu-div noch ein weiteres legen, was ein <img> enthält, welches auf die entsprechenden Maße angepasst ist. Die Verzerrung des Imgages beim Stauchen ist in Ordnung, da es ja ein Verlauf ist. Dadruch ist gewährleistet, dass das Bild zu jeder Größe des Menus passt.

      Mit freundlichen Grüßen, Lucas

      --
      selfcode: sh:( fo:| ch:? rl:° br:& n4:° ie:| va:| de:< zu:) fl:| ss:) ls:< js:|