Imageslider "Nach Hinten Stellen"

**SvenH** · 05.02.2010, 09:39

Hallo zusammen, ich habe folgendes Problem:

Ich hab in meinem Header das Imageslidermodul integriert.
Nun möchte ich den Container mit einer entsprechenden Hintergrundgrafik Ebenenmäßig über dem Imageslider (und somit dem Imageslider) ablegen, damit die durchlaufenden Bilder teilweise noch durchscheinen.

Ich denke mir dass es doch ein Z-Index Problem sein sollte, oder???

Wie kann ich es anstellen, damit das klappt????

Lg,

Sven

**MacKP** · 05.02.2010, 10:27

Hallo SvenH,
mittels Position und z-index geht da schon einiges wie du dir schon selber denkst.
Hier könntest du dir mal anschauen wie das gehen könnte -> http://www.swierzy-gmbh.de/

Da hab ich das Logo und ein Teil der Navi über Slideshow gelegt.

Viele Grüße

**SvenH** · 05.02.2010, 13:01

Genau das suche ich......
Nun eben die Sachlage...
Oben der Header mit Menü und drunter der Imageslider.
Dann kommt ja der Container mit main und right.
Nun soll das Hintergrundbild des Containers über dem Slider im Header liegen und somit nur noch in der Mitte einen Teil des Sliders zu sehen sein.

http://www.masurenferienhaus.de

Dort habe ich den Containerbereich bereits rot hinterlegt, damit ich seh was ich mach.... Komme aber nicht weiter....

***lucina*** · 05.02.2010, 13:40

Ich hoffe, ich habe einigermaßen richtig verstanden auf was Du da hinausmöchtest - quasi so eine Art 'U' über dem Slider, oder wie? Und das dann semitransparent?

Mir fallen dazu mehrere Sachen ein - mit opacity zu arbeiten, oder ein png in einem eigenen Container als Inhaltselement einzufügen und dass dann via z-index zwischen #slider und #container darzustellen (-> relativ dazu positionieren).

Beides hat ein paar Tücken auf älteren Browsern, aber die sind ja nun nach Googles Ankündigung, den IE6 nicht weiter zu unterstützen, einigermaßen endlich. Zu opacity gibt es von David Walsh was nettes mit Mootools.

Aber vielleicht erklärst Du es mir noch mal etwas genauer am Besten mit einem Scribble oder einem Entwurfsscreenshot.

LG, Carolina.

**SvenH** · 05.02.2010, 15:19

Hallo Lucina,

Genau so sieht es aus.... Ich habe ein png in dem das U in der Mitte frei ist, und somit noch Blick auf den Slide frei geben soll.
Und eben dieses Png hab ich als hintergrund im #container.

Nur hab ich eben keine Ahnung mehr wo ich noch schauen soll, denn egal was ich als z-index angeb... Der Slide steht immer "Oben"

***lucina*** · 05.02.2010, 15:39

Naja, positionieren musst Du es ja dann schon, wenn *darüber* liegen soll - sonst wird das ja brav hinter-/untereinanderweg ausgegeben.

Code:

#container{
     position: relative;
     top: -200px;
}

macht bei mir schonmal sowas:

Feintuning ist angesagt. So wirklich transparent ist Deine Grafik ja noch nicht. Ich glaube, ich würde das Hintergundbild einem separaten Element zuweisen, dass ich unter dem Kop einfügen würde. Und dann einen Hintergrund für den #container unten nahtlos dranhängen.

Mit besten Grüßen,
Carolina.