Imagerotator/slider als wechselndes Background image für body-Tag
Hallo zusammen!
Ich habe folgendes vor:
Eine Webseite, deren bodybereich kein einfaches Hintergrundbild per CSS-Anweisung background-image: url(blablubb.jpg) enthält, sondern der Hintergrund der kompletten Webseite soll eine Slideshhow sein, also wechselnde Fotos als Hintergrund. Darauf soll dann die eigentliche Seite abgebildet werden.
Nun google ich seit mehreren Stunden herum, und komme zu keinem befriedigendem Ergebnis, wie ich das lösen könnte.
Nun gibt es ja die Erweiterung imageslider. Ist es irgendwie Möglich, den Imageslider im Hintergrund als Body-Background sozusagen laufen zu lassen und auf dem Bereich des imagesliders meine Homepage abzubilden?
Einfach gesprochen, ich möchte kein statisches Hintergrundbild für meine Webseite, sondern einen Imageslider. Gibt es die Möglichkeit, einem Tag, wie zum Beispiel <body>, nicht nur ein einfaches Bild sondern den Imageslider zuzuweisen? Und wenn nicht, hat jemand eine idee wie ich das lösen könnte?
Liebe Grüße
Der_Ritter
CSS-Lösung vielleicht nicht die beste ...
Zitat:
Zitat von
lucina
... (Via 'eigene Layoutbereiche' in 'Einstellungen', dann in 'Templates' - 'neues Template' - aus 'fe-page' und dann den Teil mit Custom-Sections direkt hinter das öffnende 'body'-Tag platzieren). Dann könntest Du dorthinein einen Imageslider packen. ...
Danke Carolina (lucina), so hab ich's gemacht.
Zur Projektsite HIER KLICKEN
Erster Schritt:
HTML-Code:
<?php echo $this->getCustomSections('before'); ?>
direkt hinter den body-Tag.
Zweiter Schritt:
Zentrierung der (1700px breiten) Slideshow2 per CSS:
HTML-Code:
#bannerblackstripe .inside {
left:50%;
}
.mod_slideshow2 {
width:1700px;
height:345px;
position:absolute;
margin-left:-850px;
}
Dritter Schritt:
Um den nun entstandenen horizontalen Scrollbalken wegzubekommen, habe ich dem body folgende Eigenschaft verpasst:
HTML-Code:
body {
overflow-x: hidden;
}
Für Manöverkritik bin ich dankbar, hat jemand vielleicht eine bessere Idee (speziell bei overflow-x:hidden fühle ich mich nicht sehr wohl ;)).
Kleine Ergänzung: Auch den (bis an den rechten Rand des Browserfensters gehenden) schwarzen Balken als Navigationshintergrund habe ich durch die CSS-Definition von .blackstripe zentriert. Letzteren zum Probieren per Firebug vielleicht einfach ausblenden.
