Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • September 9, 2023 at 5:33 pm #1418560
    mediafacto

    hello i need help :)

    because im trying to create lightbox popup with this méthod : https://www.youtube.com/watch?v=ezR27jB7zL8
    and it’s working great but i have 2 side effects i can’t solve because i can’t overide with css these 2 issues.

    1) you can see on this page https://www.voxius-avocats.com/florian-carriere-steven-theallier-voxius-avocats/#florian-carriere
    then on the both blocs in this page that is working great but there is two icons at the bottom that do not have the color i chose…
    its my first probleme : something is overwriting my color prefs bur i know what.

    and it’s the same on mobile.

    2) just on mobile if you follow the same link, you will see the same page and if you click on the first bloc, everything is ok …..but if you click on the second bloc, you will see that the content be loaded and disappear immedialtly and you have scroll down to see the content

    can you help me for this 2 issues ? thanks

    September 10, 2023 at 9:37 pm #1418691
    Mike

    Hey mediafacto,
    Thanks for the link to your site, in the popup the blue one was not correct, try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field to correct:

    #top .mfp-content .avia-button.av-4pqcoe-31648334b4896fbdfea9d05f47606f6f,
#top .mfp-content .avia-button.av-eh4dwu-7ff5582dbec01723c9e3c0eb24a72468{
    background-color: #0e76a8;
    border-color: #0e76a8;
    color: #ffffff;
}

    After applying the css, please clear your browser cache and check.
    To stop your page from scrolling try adjusting your script to this solution.

    Best regards,
    Mike

    September 10, 2023 at 9:47 pm #1418692
    mediafacto

    thanks !

    but for the issues number 2, the script working great, only in mobile there is this scroll
    you can’t help me with that ?

    September 10, 2023 at 9:55 pm #1418693
    mediafacto

    hello sorry i didnt see the link lol

    i try :)

    September 12, 2023 at 10:55 am #1418870
    mediafacto

    hi !

    the code you gave me for the color of the social button doesn’t work on mobile
    can you help me with that too ?

    September 12, 2023 at 12:19 pm #1418876
    Guenni007

    one thing to mention – that video is from 2018. Meanwhile, many deprecated functions have been removed in newer versions of jQuery.

    so the video shows:
    $(window).load(function(){ …
    this is now:
    $(window).on('load', function(){

    instead of using that script Mike linked to – use the filter:

    add_filter( 'avf_default_lightbox_no_scroll', '__return_true' );
    September 12, 2023 at 5:38 pm #1418922
    Mike

    Hi,
    Try adding this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

    @media only screen and (max-width: 767px) { 
#top .mfp-content .av-9g7ebi-f2e12a2e9a0504676810d016a51cefd3,
#top .mfp-content .av-4xc9se-e01829d9bd552af3332b6fd9af5b84e8 {
    background-color: #0e76a8;
    border-color: #0e76a8;
    color: #ffffff;
}
}

    Thanks for pointing out the filter Guenni007

    Best regards,
    Mike

    September 12, 2023 at 5:58 pm #1418923
    mediafacto

    sorry the last code doesn’t work on mobile the color stay the same… :-(

    September 13, 2023 at 4:09 am #1418978
    Mike

    Hi,
    Try this css instead:

    #top .mfp-content .avia-builder-el-69 .avia-button:first-child,
#top .mfp-content .avia-builder-el-80 .avia-button:first-child {
    background-color: #0e76a8;
    border-color: #0e76a8;
    color: #ffffff;
}

    Best regards,
    Mike

    September 13, 2023 at 9:49 am #1419007
    mediafacto

    sorry neither …

    September 13, 2023 at 8:18 pm #1419086
    Mike

    Hi,
    Odd when I test it works, please ensure to copy the code from the forum and not an email notification so the symbols are not converted, then try disabling Enfold Theme Options ▸ Performance ▸ JS & CSS file merging and compression and clearing any caching plugin and then your browser cache. Please note that testing with iPads & iPhones can be hard to clear the cache, often you need to also clear the history to fully purge the cache, following these steps for Safari and note Step 4 where you will Clear the History.
    Otherwise try adding the css to WordPress ▸ Customize ▸ Additional CSS if this doesn’t help please include an admin login in the Private Content area so we can be of more assistance.

    Best regards,
    Mike

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