Transition between pages is missing.
-
Dear Layteam,
On my site the fade-in-out transition between the pages is not working. I used a lot of custom HTML, but it doesnt even work on project-thumbnails i placed in the gridder layout. I send you the link via e-mail. Thank you for looking into it!
Felix
-
Hey Felix!
I just looked at the website you sent me a link of via email.
because of this custom css you use, the transition doesn't work:
#main-region {
opacity: 1!important;
}If you have custom links that should fade the website, please update lay theme to 2.8.7. Your links should resemble this format:
<a href="http://mywebsite.com/mypage" data-type="project" data-id="12" data-catid="[1,2]" data-title="My Title">My Link</a>
data-catid is optional, data-type can be "project", "page" or "category".
The id is the id of a page, catid are the ids of a project's category in case you link to a project. The title is the project's/page's title. -
Dear Armin,
Thank you very much for your help, now the transition is working.
It seems that the row-gutters in the project overview are not transitioning but they just disapear by clicking on a thumbnail or link. The now missing space is cut off at the end of the page just before the transition starts. it happens when the browser window is minimum about 2000 px wide. Could you give me a hint why this happens? Thank you again. Felix
-
Hey Felix,
Please remove all of your custom css and see if the problem still remains.
Then, add your custom css, bit by bit and see which piece causes the problem. -
Thank you for your info, this is a good method. i found out that a "mix-blend-mode: difference" is causing transition-problems from a certain height on in chrome (in firefox it works fine). if i delete the last row it works fine, if i add more rows it gets worse. i think i dont know if there is a fix for this, i will keep looking...
Felix -
Dear @fr
great! Good luck with this!Marius
-
To close this topic: it is a »bug/feature« of chrome browser, to stop rendering transition effects from a certain height on when the webpage is visually too big, for example on a full screen browser window on a imac 5k retina display.
Felix
-
Dear @fr
5k retina is quite big…Best
Marius
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it