---
title: "Dynamische css background-image(s) in Verbindung mit media field?"
url: "https://www.typo3.net/d/102638-dynamische-css-background-images-in-verbindung-mit-media-field"
source: "typo3.net"
tags: ["Allgemein","Bilder","Frage","JavaScript & AJAX"]
created: "2010-11-26"
last_reply: "2010-11-29"
replies: 1
solved: false
page: 1
pages: 1
lang: "de"
---

# Dynamische css background-image(s) in Verbindung mit media field?

Allgemein · 1 Antwort · gestartet 2010-11-26

## Eröffnungsbeitrag

**jousch** · 2010-11-26 · [Beitrag #1](https://www.typo3.net/d/102638-dynamische-css-background-images-in-verbindung-mit-media-field/1)

Hallo liebe Leute,

ich hab prinzpiell das hier gefunden: [/d/71995-im-body-tag-hintergrundbild-via-levelmedia-einfuegen](https://www.typo3.net/d/71995-im-body-tag-hintergrundbild-via-levelmedia-einfuegen)

das sagt mir mal wie es praktisch mit einem Bild funktioniert.

Ich versuche allerdings das ganze über ein Javascript zu realisieren, bei dem ich als erstes einen Array mit den URLs zu den Bildern angeben muss.

```html
//...
// Set speed (milliseconds)
var speed = 1000

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = 'slideshow1_1.jpg'
Pic[1] = 'slideshow1_2.jpg'
Pic[2] = 'slideshow1_3.jpg'
Pic[3] = 'slideshow1_4.jpg'
Pic[4] = 'slideshow1_5.jpg'
//...
```

bzw. ich bin grad dran das ganze mit jQuery umzusetzen....

```html
<script type="text/javascript">

    var bgArr = ["uploads/media/img1.jpg", "uploads/mediaasdf/img3.jpg", "uploads/mediaasdf/img4.jpg", "uploads/mediaadsf/img5.jpg", "uploads/mediaasdf/img1.jpg" ]; 
    var i=0;

    // Slideshow, nen
    setInterval(function() {
        $("#restaurante").css("background-image", "url("+bgArr[i]+")");
        (i < bgArr.length-1) ? i++ : i=0 
    }, 20000); 

    // es scheint als ob hier das forum was wegmacht ;---(
</script>
```

Jetzt würd ich gern wissen, wie ich das vernünftig machen kann.

Prinzipiell binde ich diese Bilder, sofern ich die IMAGE-Version brauche so ein sofern keine besonderen GIFBUILDER-Sachen darauf angewendet werden müssen:

```typoscript
lib.josdesign = COA
lib.josdesign {
  10 = TEXT
  10.data = levelmedia: -1, slide
  10.split {
    token = ,
    cObjNum = 1
    1 {
      10 = IMAGE
      10.file.import.current = 1
      10.file.import = uploads/media/
    }
  }
}
```

in wie weit muss ich das abändern, damit ich dies erstens in den <HEAD>-Tag bekomme und wie, das diese durchnummeriert gewrapped werden? :o ..da steh ich quasi a bissal an!

Bin für jeden Tipp dankbar! Vielen Dank im Voraus!

## Antworten

### [#2](https://www.typo3.net/d/102638-dynamische-css-background-images-in-verbindung-mit-media-field/2) · jousch · 2010-11-29

Die Lösung wird wohl jetzt so aussehen: (thx an Klausiiii)

```typoscript
page.headerData.10 = COA
page.headerData.10 {
 10 = TEXT
 10.value = Pic = new Array();
 
 20 = TEXT
 20 {
  data = levelmedia: -1, slide
  split {
   token = ,
   cObjNum = 1
   1.wrap = Pic.push("http://domain.net/uploads/media/|"); 
   1.current = 1
  }
 } 
 
 wrap = <script language="javascript">|</script>
}
```

---

Quelle: „Dynamische css background-image(s) in Verbindung mit media field?“, typo3.net, https://www.typo3.net/d/102638-dynamische-css-background-images-in-verbindung-mit-media-field
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.