---
title: "Mask Extension data-background verwenden, siehe Screenshot im Anhang"
url: "https://www.typo3.net/d/128290-mask-extension-data-background-verwenden-siehe-screenshot-im-anhang"
source: "typo3.net"
tags: ["Extensions","Bilder","Fluid","Frage"]
created: "2020-09-09"
last_reply: "2020-09-23"
replies: 2
solved: false
page: 1
pages: 1
lang: "de"
---

# Mask Extension data-background verwenden, siehe Screenshot im Anhang

Extensions · 2 Antworten · gestartet 2020-09-09

## Eröffnungsbeitrag

**stesi** · 2020-09-09 · [Beitrag #1](https://www.typo3.net/d/128290-mask-extension-data-background-verwenden-siehe-screenshot-im-anhang/1)

Hallole,
vielleicht kann mir ja jemand helfen? Ich möchte gerne einen Slider mit Mask bauen. Was ich nicht hinbekomme ist die Ausgabe der Bilder im Frontend. Ich mache da irgendwas falsch, siehe Screen, denke es liegt an f:uri ...., was muss ich denn da verwenden? (Siehe Screenshot im Anhang)

Vielen Dank im Voraus!

## Antworten

### [#2](https://www.typo3.net/d/128290-mask-extension-data-background-verwenden-siehe-screenshot-im-anhang/2) · lenjka · 2020-09-23

Sehe kein Screenshot im Anhang.
Ich verwende das

```html
<div class="carousel-inner">
                <f:for each="{data_image}" as="bild" iteration="zahl">
                    <div class="carousel-item  {f:if(condition: zahl.isFirst, then: 'active', else: '')} ">
                        <f:image image="{bild}" class="img-fluid" maxWidth="1920" />
                        <f:if condition="{data.tx_ljbilderslider_ljbilderlayeron}">
                            <f:then>
                                <div class="carousel-caption {f:if(condition: '{data.tx_ljbilderslider_ljbilderlayeroverlay}', then: 'overlay', else: '')}">
                                    <f:render section="textLayer" arguments="{_all}" />
                                </div>
                            </f:then>
                        </f:if>
                    </div>
                </f:for>
            </div>
```

also f:image

### [#3](https://www.typo3.net/d/128290-mask-extension-data-background-verwenden-siehe-screenshot-im-anhang/3) · lenjka · 2020-09-23

Wenn es darum geht ein Bild als hintergrundbild zu laden dann setze ich das bil erst in eine Variable

Alos so in der Art:

<f:variable name="BgImage" value="{f:uri.image(src:data_image.0.uid, treatIdAsReference:1)}" />
<div class="intro appear-animation" style="background-image: url('{BgImage}'); " ></div>

---

Quelle: „Mask Extension data-background verwenden, siehe Screenshot im Anhang“, typo3.net, https://www.typo3.net/d/128290-mask-extension-data-background-verwenden-siehe-screenshot-im-anhang
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.