If anybody needs it, here is the script I used. It was tricky because there was an annoying phenomena between the hover and the scroll functions. Basically while scrolling the page, the browser (Chrome especially) doesn't send any other mouse coordinates, therefore the hovered video was constantly there till the scroll was stopped. Here is a script that avoid this problem: <script> let hoveredElement; let mouseX = 0, mouseY = 0; document.addEventListener('DOMContentLoaded', () => { document.addEventListener('mousemove', event => { mouseX = event.clientX; mouseY = event.clientY; hover(event.target); }); document.addEventListener('scroll', () => { const hoverTarget = document.elementFromPoint(mouseX, mouseY); if (hoverTarget) { hover(hoverTarget); } }); }); function hover(targetElement) { // If the target and stored element are the same, return early // because setting it again is unnecessary. if (hoveredElement === targetElement) { return; } // On first run, `hoveredElement` is undefined. if (hoveredElement) { if (hoveredElement.hasAttribute("data-videoid")) { document.getElementById(hoveredElement.getAttribute("data-videoid")).classList.remove('hoverscrolled'); console.log(hoveredElement.getAttribute("data-videoid")); console.log(document.getElementById(hoveredElement.getAttribute("data-videoid"))); } } hoveredElement = targetElement; if (hoveredElement.hasAttribute("data-videoid")) { document.getElementById(hoveredElement.getAttribute("data-videoid")).classList.add('hoverscrolled'); console.log(hoveredElement.getAttribute("data-videoid")); console.log(document.getElementById(hoveredElement.getAttribute("data-videoid"))); } } </script> HTML: <div data-videoid="one_data" > </div> <video id="one_data" class="vid_background" autoplay muted loop> <source src="https://somevideo.mp4" type="video/mp4"> Your browser does not support HTML5 video. </video> CSS: video.vid_background{ opacity: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -5; width: 40%; position: fixed; height: 50%; -webkit-transition: none; -o-transition: none; transition: none; } video.vid_background.hoverscrolled { opacity: 1; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -5; width: 40%; position: fixed; height: 50%; -webkit-transition: none; -o-transition: none; transition: none; }

@Johan-Saj I just tried and it also didn't worked… but thanks!!

@arminunruh cool!

these are the image sizes that are generated: '_265', '_512', '_768', '_1024', '_1280', '_1920', '_2560', '_3200', '_3840', '_4096' these are the pixel widths so 768px and so on using the image srcset, only the correct size is loaded into the browser, based on the width of the image in the current browser and device this is more performant than just loading the original image so just because your uploads folder is very large it doesnt mean your website is slow when you visit it you can disable all plugins, lay theme works without any extra plugins but if you want to use any addons → laytheme.com click "addons" you need to keep them activated you can send me your website url and such so i can take a look myself: can you send your website address, /wp-admin/ username and password and a link to this topic to info@laytheme.com?

Hey Armin, thanks for the correction. Is the image swap on your to do list too? Thank you

also there is this: +more → +embed i think you can just put a soundcloud song url in here maybe that works too

ok maybe if it doesnt work its the wrong css mmh

mh maybe use a transition on the images themselves inside the container, not just the container (sry dont have time to do custom css for you :/)

i think it takes some time for google to realize these links are gone also make sure u removed any links to these pages also google if you can find a solution maybe a sitemap, dont know

hey so when the loop is active on carousels, the carousel will always clone html to make it have an endless loop. when the html is cloned, the image will reload so then there is a flash. nothing i can do here

@arminunruh horrible news in the morning :/. Is there a way to play the webm in chrome and a different codec in safari ? Like a hermaphrodite Video ? I also just realized that my phone isn’t interested to play the webm s as well.

for license key issues always write licensekeys@laytheme.com

hey man, you need to create a new page, design what you need in your footer and then save it. Once you've done that go to Lay Options > Footer and then activate it in there. There's more info here: https://laytheme.com/documentation/footers.html

@Bastion problem solved!

@arminunruh oh amazing, thank you :)

right now thats not possible u can add a css class to a menu point: https://www.lockedownseo.com/add-css-classes-to-menu-items-in-wordpress/ and then use css to put an item there using the ::before of ::after css selector: https://krasimirtsonev.com/blog/article/CSS-before-and-after-pseudo-elements-in-practice

ah yes yes will be fixed with the next update!

hey please look at this: https://laytheme.com/troubleshooting.html#critical-error