Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • #830835

    Hey Guys…
    The new mobile menu is very cool, thank you!
    Can you help me with one thing…the back to top arrow isn’t showing on mobile anymore. Can you provide me with some quick css for this?

    Thanks for your help
    Gary

    #830930

    Hey alliancepp,

    To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

    Best regards,
    John Torvik

    #833712

    Thanks John. The url is below.
    Have a great day
    Gary

    #834177

    Hi,

    Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
    .responsive #scroll-top-link {
        display: block !important;
    }
    }

    Best regards,
    Rikard

    #834405

    Rikard, Good morning.
    That worked perfectly. Now the back to top arrow is working. Thank you.

    One other issue I noticed. When I view Enfold sites vertically on the ipad, the main menu is getting covered up by the logo…it’s not going to the mobile menu. Can you help me with that as well. I put a link to an image preview below.

    Thanks for your expertise!
    Gary

    #834665

    Hi Gary,

    Please try the solution presented here: http://kriesi.at/documentation/enfold/menu-overlaps-logo-on-tablets/

    Please let us know if that works for you.
    Best regards,
    Sarah

    #1200343

    Hello @rikard .. is there a way we can display this when someone reaches 75% of the overall page and not right after you start scrolling?

    #1200743

    Hi,

    Provide a link to this site/page in question so we can look into this issue further.

    Best regards,
    Jordan Shannon

    #1200799

    I am addressing “the back to top arrow” on mobile
    is there away we can let it display when we reach 75% scroll to the end of the page ?

    #1200850

    Hi,
    As I’m sure you are aware, the “scroll-top-link” doesn’t show on mobile screens by default, so you would need to use some css like this for it to show:

    @media only screen and (max-width: 767px){
    .responsive #scroll-top-link {
        display: block;
    }
    }

    But for your question to have the button show when the scroll reaches 75% of the page, after you apply the css please edit \wp-content\themes\enfold\js\avia.js on line 862 you should find if(st < 500) change to if(st < $(document).height()*0.75)
    Then clear your browser cache and any cache plugin, and check.

    Best regards,
    Mike

    #1200874

    Hello @Mike
    I am aware of the first code !
    The 75% code did not work
    i did exactly what you said
    The moment i start scrolling, then i get this arrow !
    (cleared cache and purged that page but it didnt work )

    • This reply was modified 3 years, 11 months ago by Cloudypro.
    #1200905

    Hi,
    I see that you have the Enfold Theme Options > Performance > JS & CSS file merging and compression enabled so perhaps the original avia.js is still loading. Try disabling the file merging and compression and clearing your caches again.
    I tested this on my localhost before posting so I’m sure it works, but it still took a few tries to clear the cache and load the new avia.js

    Best regards,
    Mike

    #1200988

    Ok @Mike
    I will try it
    Thank you very much !

    #1201028

    Hi,
    Happy to help.

    Best regards,
    Mike

    #1321296

    Hello,

    On this page > https://kriesi.at/documentation/enfold/menu/#scroll-to-top

    Change the background color using the below CSS

    /* Background */
    #scroll-top-link {
        background-color: #1ec5bc;
    }

    This CSS does nothing. Changed color to #000000 to check. Cleared server and browser cache. Still nothing. Added !important still nothing.

    ALSO, I’d like to change background color AND background color on hover, independently.

    Any ideas?

    Thanks,

    Jasmer

    • This reply was modified 2 years, 6 months ago by Jasmer. Reason: added url in private content
    #1321364

    Hi,
    Thank you for the link to your site, I couldn’t find your attempted css in your merged css, but perhaps you have a missing bracket, unclosed comment or some other error in your stylesheet, nonetheless this css will change the background color and arrow and on mouse-over:

    #top #scroll-top-link {
        background-color: #000;
    }
    #top #scroll-top-link:before {
        color: #fff;
    }
    
    #top #scroll-top-link:hover {
        background-color: #F7F7F8;
    }
    #top #scroll-top-link:hover:before {
        color: #000;
    }

    After applying the css, please clear your browser cache and check.
    If this doesn’t work for you then it could point to an error in your stylesheet, try this in the WordPress ▸ Customize ▸ Additional CSS field.

    Best regards,
    Mike

    #1321429

    Thanks Mike! Worked perfectly!

    #1321432

    Hi Mike,

    How can I hide the tooltips on ONLY the Back To Top Arrow? I think CSS rather than a functions.php correct?

    See screenshot below

    Thanks,

    Jas

    #1321454

    Hi,
    Thank you for the screenshot, on the right side, when you hover over the scroll to top button the tooltip “Scroll to top” is created by the title attribute of the element by a browser function, to remove this you will need to remove the title of the element which can be done with the script, try adding this code to the end of your functions.php file in Appearance ▸ Editor:

    function remove_title_from_scroll_top_on_hover() { ?>
        <script>
    (function($){
      $("#scroll-top-link").hover(function(){
        $(this).removeAttr("title");
      });  
    })(jQuery);
    </script>
        <?php
    }
    add_action('wp_footer', 'remove_title_from_scroll_top_on_hover');

    The link information on the left side is also from a browser function but it can not be hidden by the site as it is user side information only.

    Best regards,
    Mike

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