Forum Replies Created
-
Posts
-
Hi Ismael I was able to use the JS code in conjunction with the core wordpress video functions, it seems the enfold player might be the culprit to make this work!
here is what i did:
<figure class=”wp-block-video”><video src=”video_url” autoplay=”autoplay” loop=”loop” muted=””></video></figure>Hi Rikard,
Thank you for getting back to me.
Maybe my approach is off which could be part of my problem i did tweak my right position since you last saw it to hopefully make it on the edge of the right side. My intentions are to have a fixed or sticky button that stays against the right side of the page see the “bring may to my city” orange button on the right of the page: http://maymobilitydev.wpengine.com/wp-content/uploads/2020/09/ideal.png (hosted on WPengine)
Ideally i would like it to work similar to the contact centria sticky button shown on the right of the page on this site where its always on top (vertical stacking order) of the rest of the elements on the page: https://centriahealthcare.com/
here is my css for the button.
may-floating-cta {
position: fixed;
top: 46%;
right: 0px;
z-index: 999999!important;
background: #FF9C17;
border: 2px solid #FF9C17;
color: white;
text-align: center;
padding: 10px;
border-radius: 5px 0 0 5px;
transition: all .3s;
line-height: 1.2;
font-weight: 700;
font-size: 12px;
}In addition to possibly helping me with it running off the screen: i would like it so it is on top of all elements on the page (vertical stacking order). You can see in this screen shot where it goes behind the video element http://maymobilitydev.wpengine.com/wp-content/uploads/2020/09/stack-issue.png
2. that was what i was afraid of. I wasnt sure if i could set a class and have them be 100% width or not somehow that i was overlooking.
Hi Mike!
You lead me down a great path. I was able to pull this off doing this for anyone else who has to do this:
.av-main-nav-wrap {
width: 100%;
}
.av-main-nav-wrap ul {
position: relative;
z-index: 3;
width: 100%;
display: flex;
justify-content: center;
}
#header.header-scrolled-full .av-burger-menu-main.menu-item-avia-special {
width: 100%;
display: flex;
justify-content: flex-end;
}Mike! This works excellent. I applied those updates on my dev site.
Only thing I had to do, not sure-if there was an easier way to add something in the css to also change from centered menu to right on scroll. I am using a bunch of media queries and padding push it right.
Hi Ismael,
I think you are misunderstanding the issue. Regardless of what video is in the top color black and the bottom video section, as soon as I add any video in a video section (like i did at the bottom), it breaks the color block background video at the top and makes the video appear in some weird tile.
You can delete the video section at the bottom and you will notice the color block background video starts working again as intended.
See my screen shot to see how the video section at the bottom of the site is impacting the color block with background at the top in these weird tiles:
http://lifelivingstag.wpengine.com/wp-content/uploads/2020/07/Screen-Shot-2020-07-10-at-10.44.48-AM.png (hosted on WPengine)
Hello Ismael,
Sorry I had to find an alternative to launch the website but I brought it back on the staging environment for you to review:
you can see the color section at the top looks all messed up with the background video which is caused as soon as I added the video element on the bottom of the site.
