Lay Theme Forum

But when I add it to the menu it will be displayed with its name "Menu overlay" and only when you click on it it will open but my idea is that it should be displayed every time without having to click on a link.

Hey I just discovered the Overlay feature and created an overlay page. Now I don't understand how I can place that overlay on every page. The overlay I created is supposed to be a menu so it needs to be on every page.

Please let me know. Thank you so much! <3

@alasdair17 It didn't work unfortunately. Is there another way to do it?

@Alex-F thank you!
it was super easy. Just use the class you assigned and put it in custom css:

h4 {
color: #ffffff;
-webkit-filter: blur(0px); /* Safari /
filter: blur(0px);
   transition: ease-in-out 0.7s;
}
h4:hover {
color: #ffffff;
-webkit-filter: blur(8px); / Safari */
filter: blur(5px);
   transition: ease-in-out 0.7s;
}

I would like to change the appearance of certain menu points when activated: When I click on "Workshops" I would like it to be blurred. Same with "Info". I already managed to blur them with hover but how can it stay like that?

and is there an option to always jumpt to the beginning of the cache when click on it? Bc my site title is linked to the same page as the "info" menu point. It would be cool even though you are on the site it jumps back to top when you click on the menu point/ site title.

website: boothsix.eu

Thank you so much in advance!!!
Best XX,
Antonia

@arminunruh Okay I see. Anyways thank you! <3

So my website works fine with safari. The text ist displayed as it should. When I switch to Chrome the text looks like in safari except for the text on the front page.
It doesn't affect the whole front page but just three text blocks on it. Chrome displays the font weight as bold, when it's supposed to be normal.

I tried to create a new text format only for the three blocks with a normal font-weight - nothing changes. I assigned the three text blocks to a certain class (chrome-shrift) and wrote in custom css for desktop .chrome-schrift {font-weight: normal;} still nothing changes.

It is so odd because everything else looks perfectly fine. Just these three Blocks. What can I do?
Oh and deleting the Browser cache doesn't help either.

website: boothsix.eu

Best XX
Antonia

Hey guys,
is there a possibility to blur 1/4 of the upper part of the page when scrolling with custom CSS and html in laytheme? Similar to this example: https://kaleidoskopmusik.de

And once you started scrolling it will stay (even when you're not scrolling) and only disappears when you scroll back to the top.

The Website: http://boothsix.eu/info/ (wip)

Thank you so much in advance!

Hey guys,

I recently finished my very first portfolio site. I am so glad that I could make my design vision become reality with LayTheme.
Thank you for creating this Theme!

It would mean the world for me when some of you may visit the site! Feedback and tips are highly appreciated.

www.antoniaviola.com

All the best xx,

Antonia

@Richard-K Alright no problem! Respond when you have time and thank you very much :)!

Thank you so much! yes Richard of corse!!

This is the costume code I am using for every Project-title:

<section class="project1" id="project-1">
<header class="project-header">
<h3 class="project-category">DESIGN</h3>
<h3 class="project-title1" + class="hover-title2">
<a href="https://antoniaviola.com/in_concert">
<span class="fx-title1 fx-title--a fx-speed--1">Fragile 070Shake</span>
<span class="fx-title1 fx-title--b fx-speed--1">Fragile 070Shake</span>
</a>
</h3>

                </header>
               
                


 
<style>

a{
color: white;
}

a:hover {
color: #9000f7;
}

.project1 {
z-index: 5000;
display: flex;
flex-wrap: wrap;
width: 140%;
height: 8.6vw;
}

/* PROJECT HEADER */

.project-header {
display: flex;
width: 100%;
color: white;
font-family: 'ACE-110-DELUXE';
}

.project-category {
    z-index: 1;
    width: 0%;
    padding-top: 0vw;
    padding-bottom: 0vw;
    padding-left: 0vw;
    padding-right: 0vw;
    text-align: center;
    vertical-align: middle;
}

.project-title1 {
    z-index: 2;
    white-space: nowrap;
    display: flex;
    justify-content: left;
    align-items: left;
    width: 200%;
    position: relative;
    overflow: hidden;
    padding-right: 50vw;
    cursor: pointer;
    transition: all 200ms ease;
   
}

.project-title1:hover,
.project.state--active .project-title {
    color: #9000f7;
}

.fx-title1 {
z-index: 100;
display: block;
width: 100%;
font-size: 8vw;
text-align: center;
position: absolute;
animation-duration: 7s;
animation-iteration-count: infinite;
animation-timing-function: linear;

}

.fx-speed--1 { animation-duration: 30s }

.fx-title--a { animation-name: fx-title--a }
.fx-title--b { animation-name: fx-title--b }

@keyframes fx-title--a {
0% { right: -100%; }
100% { right: 0% }
}

@keyframes fx-title--b {
0% { right: 0%; }
100% { right: 100% }
}

.project.state--active .fx-title1,
.project-title1:hover .fx-title1 {
animation-play-state: paused;
}
</style>

Hello,

I tried a lot and nothing is working.
Can someone help me with showing a background picture/video on hover. It's costume HTML that's why the hover Plugin is not working.

When you hover on the title it stops and should show a background picture (clouds) fullscreen. How can I do that?

website:
https://antoniaviola.com/front-page

Greetings from Constance :)

@mariusjopen wow thank you! I don't understand why it didn't work.
Thank you so much!

Hey guys
I tried very hard to make this work but no code is working.
Can someone help me with changing the background color of my navbar on my projects site from black to #a987f1 ?
Thank you so much!

http://antoniaviola.com/category/projects/