Tagged: ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • September 21, 2022 at 4:32 pm #1365875
    welswebmaster

    Hi Enfold team,
    I have two issues where I’d need your support please; both on the same page at top (see private URL).

    1 – Full-width Easy Slider
    The second slide displays a video (Vimeo URL) and displays it fully, without stretching or cropping which is GOOD. However, I’d like to change the black background instead to an image or color. I can make the change in FF Web Tools this way
    <body class="vp-center" style=background-color: red;">
    But when I use this CSS, it doesn’t work. What is the correct way to specify in the Quick CSS. I’m missing something. 

    body .vp-center {
background-color: red !important;
}

    2 – Sub menu navigation
    The sub menu displays correctly when scrolling by sticking to the header which is GOOD. However, when clicking on a video in the left column and then scrolling, the sub menu is on top of the video player. I tried changing the code to a different z-index and it doesn’t work. Maybe I’m targeting the wrong thing. Here are all the layers.

    /* Keep Last - Fixes video under Enfold containers - all below here */
aside.sidebar  { z-index: 0!important;  }
.vm--block-scroll  #header  { z-index: 0!important; }

.v--modal-box .vimeography-modal-modern-touch {
        z-index: 1!important;
        position: relative !important;
top: 180px !important;
background: url(https://synodconventio.wpengine.com/wp-content/uploads/2022/09/footerBakCrossGradient.webp) navy;
}
#top .av-submenu-container.av-sticky-submenu { 
        z-index: 2!important;
        position:relative;
}
.flex_column.avia-builder-el-2  {
        z-index: 1!important;
        position: relative;
}
#rightside { z-index: 0!important;
position relative;
}

    Thank you for your support!

    September 22, 2022 at 8:37 am #1365930
    Ismael

    Hey Julie,

    Thank you for the inquiry.

    1.) We cannot find the Vimeo video in the page and when we click the “live stream” button, it just redirects to a blank page. Did you remove the video? You might be referring to the the default background color of the Vimeo player. Unfortunately, it is not possible to change the style of an element inside an iframe.

    2.) Would you mind providing a screenshot of the issue? You can use imgur, savvyify or dropbox for the screenshot. Thanks.

    Best regards,
    Ismael

    September 22, 2022 at 12:51 pm #1365976
    welswebmaster
    This reply has been marked as private.
    September 23, 2022 at 10:15 am #1366074
    Ismael

    Hi,

    Thank you for the update.

    1.) The example in the article adjusts the style of the iframe element itself but not the elements inside the iframe > document, which are not accessible by default because of certain browser policies.

    2.) Try to edit the element containing the video, apply a unique ID or Custom CSS Class name to it, then use the following css code. You can find the id and custom css field in the Advanced > Developer Settings panel. 

    #unique_id_of_element {
    z-index: 3 !important;
}

    Temporarily, you can use this css code.

    #top .av-l5k0g8uv-e23fd77e6785d6233f2aef6cc166ba21 + #after_submenu_1 {
    z-index: 3 !important;
}

    Best regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.