{containerPre -> f:format.raw()} {containerPost -> f:format.raw()} Youtube video // YouTube background embeds (v{data.uid}) - BackgroundWrapper.html var playerElement = document.getElementById('v{data.uid}'); var videoId = '{videoId}'; var div = document.createElement('div'); var params = '{youtubeParams-> f:format.raw()}'; div.setAttribute('data-id', videoId); playerElement.appendChild(div); t3sbBackgroundVideo(div, params); #v{data.uid} iframe { top: {ytVideo.ytshift}% !important; }
// Autoheight for backgroundimages - BackgroundWrapper.html document.querySelectorAll('.enableAutoheight').forEach(function(ah) { t3sbAddHeight(TYPO3, ah.id); }); BG-Image : overlay and autoheight
background-image by css
f:format.raw()}>
BG-Image : default background-image by css
f:format.raw()}>
No BG-Image Vimeo video
Local video // Local video-{data.uid} - BackgroundWrapper.html var videoWrapper = document.querySelector('#video-{file.uid}'), videoElement = document.querySelector('#video-{file.uid} video'), marginTop = (videoElement.clientHeight - videoWrapper.clientHeight)/2, shift = {shift}, id = {data.uid}, el = document.getElementById('s-'+id), winWidth = window.innerWidth; if ( winWidth < 768 ) { el.classList.remove('ratio'); } else { el.classList.add('ratio'); } window.addEventListener('resize', function(event) { resizedViewportWidth = parseFloat(getComputedStyle(document.querySelector('html'), null).width.replace("px", "")); if ( resizedViewportWidth < 768 ) { el.classList.remove('ratio'); } else { el.classList.add('ratio'); } }, true); videoElement.style.marginTop = '-'+marginTop-shift+'px'; t3sbLocalVideo({data.uid}, {localVideo.overlayChild}, {localVideo.autoplay}, {localVideo.loop}, {localVideo.mute}, videoElement ); {localVideo.inlineCSS -> f:format.raw()} Real image
No media
f:format.raw()}{styleAttr -> f:format.raw()}> {containerPre -> f:format.raw()} {row.renderedContent -> f:format.raw()} {containerPost -> f:format.raw()}
{containerPre -> f:format.raw()} {row.renderedContent -> f:format.raw()} {containerPost -> f:format.raw()}
{row.renderedContent -> f:format.raw()}
{row.renderedContent -> f:format.raw()}