Hi Vinay,

I have moved the code for doing this from the quick css to the style.css in the child theme,

what I have moved is this:

/*mobile submenu-header menu fix*/
@media only screen and (max-width: 1250px) {
#menu-header-main-menu {display:none !important;}
}

@media only screen and (max-width: 1250px) {
@media only screen and (max-width: 1250px)
.responsive #top .av-menu-mobile-active .av-subnav-menu {
display: none !important;
}
#top .mobile_menu_toggle {
display: block!important;
}
}

I’m sorry if I have not followed the directions properly for this, but so far the av-subnav-menu is not clickable on small screen resolution it shows but you can not click on it still…

I’m not sure if we were supposed to get rid of the code https://kriesi.at/support/topic/change-screen-resolution-that-fullwidth-sub-menu-kicks-to-mobile/#post-658479 that was also still in the ‘quick-css’ and I have moved it to the style.css (as you can see above no doubt)

Let me know..

thanks a tonne :)

ENB..//

Here is a sample page I just made

Test Page

The video is a background for a color section with page height set to 100%. The video is vertically centered so the top and bottom are both cut. I want the top of the video to be visible (top aligned).

Also, and it is not so important in this case, but the video is much wider than the page. Is there a way to control that?

If a photo is used as a color section background, there are some options to control the size, repeating etc. There are no options for video backgrounds. So can video backgrounds be controlled using CSS?

• This reply was modified 9 years, 6 months ago by draig.

hi,

I resized the logo and uploaded but it is still blurry. is there anything else that can be done? its is a vector resized and then save as high quality JPG or PNG and still looks blurry

More importantly, the logo still loads more to the left on mobile because it is still keeping the space for the menu. How can i removed the space on the top right that is usually for the mobile menu? I need the logo to load perfectly centered in the mobile page at all times.

Thanks in advance!

Hi there! No, I mean on mobile the logo is rather small, the header container is stretched out HUGE and the logo is nestled in the top left corner.

Hi Rikard,
I have posted the login information to the website below.
If you open the site in google chrome, the background will first be light blue solid, then dark blue solid with the video only filling the screen further on down below and partially.

Is there another way to have a background video for the site that works consistently on all three desktop browsers? We need it for the entire site, all pages and posts…should/can it be done with a plugin instead of your color section? or in code somewhere? plugins allow options for several video formats which may have to be served based on browser. if yes, which plugin works in conjunction with enfold?

Thank you

Peter

Hi Vinay,

I tried that code, cleared the cache, but nothing seems to be different with regards to the transparency of the pancake menu on mobile browsers. Here are some more specifics:

If you open Austin magician (LINK 1 in private content below) in a mobile browser in portrait mode, you’ll see the menu in the upper right as the “pancake” menu, resembling a white box with a light grey border and three horizontal lines (the pancakes) inside. For some reason, it’s not the transparent pancake menu icon at that resolution, and I’d like it to be.

Secondly, if you open LINK 2 in a *desktop* browser, you’ll see that I’m using a fullwidth slider with the image of a spiral staircase, and that i’m using the title and caption features that allow me to overlay text on the fullwidth slider. However, if you open the same page in a mobile browser, you’ll see that fullwidth slider is pushed up underneath the transparent header further than it should be and the title and caption are difficult to read because of this. How do I fix this so the fullwidth slider image extends far below the header area (like it does on the desktop) and the title and caption are in a position below the header area where they can be read easily.

(I made a different post about this second issue here before receiving your reply: https://kriesi.at/support/topic/fullscreen-slider-text-content-overlaps-with-header-on-mobile/)

In the code provided in your reply, the margin is negative, which would just make it worse, but if I make the margin positive, it forces the fullwidth slider to start 119 pixels from the top, which isn’t what we want either. The fullwidth slider should start at the very top and overlaid on it will first be the transparent header (just like we see on the desktop version) and below that, the rest of the image will show and in that area the title and caption will go (similar to how it is on the desktop). Maybe the fullwidth slider need a min-height on mobile?

Let me know if you need any more screenshots or links.

Thanks again!