Foctlider.html

<f:if condition="{data_tx_foctmaskelements_sliderelement}">
    <div id="carouselExampleIndicators{data.uid}" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
            <f:for each="{data_tx_foctmaskelements_sliderelement}" as="data_item" iteration="indicatoriterator">
                <li data-target="#carouselExampleIndicators{data.uid}" data-slide-to="{indicatoriterator.index}"{f:if(condition: indicatoriterator.isFirst, then: ' class="active"')}></li>
            </f:for>
        </ol>

        <div class="carousel-inner" role="listbox">
            <f:for each="{data_tx_foctmaskelements_sliderelement}" as="data_item" iteration="iterator">
                <div class="carousel-item{f:if(condition: iterator.isFirst, then: ' active')}" style="background-image: url('<f:for each="{data_item.data_tx_foctmaskelements_sliderimage}" as="file"><f:uri.image image="{file}"/></f:for>')">
                    <div class="carousel-caption d-none d-md-block">
                        <f:if condition="{data_item.data.tx_foctmaskelements_slidertitle}">
                            <h3>{data_item.data.tx_foctmaskelements_slidertitle}</h3>
                        </f:if>
                        <f:if condition="{data_item.data.tx_foctmaskelements_sliderdescription}">
                            <f:format.html parseFuncTSPath="lib.parseFunc_RTE">{data_item.data.tx_foctmaskelements_sliderdescription}</f:format.html><br />
                        </f:if>
                    </div>
                </div>
            </f:for>
        </div>

        <a class="carousel-control-prev" href="#carouselExampleIndicators{data.uid}" role="button" data-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="carousel-control-next" href="#carouselExampleIndicators{data.uid}" role="button" data-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>
    </div>
</f:if>