Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #597693

    LOVE this theme!! I’m trying to find a way to show the “scroll to top” button on mobile only (hidden on desktop and tablet)? I’ve found some older threads, but they seemed to always show the scroll to top button, not just hide it in certain scenarios. Thanks!

    #598008

    Hey 4thephil!

    Thanks for getting in touch!

    Please try adding the following code to the Quick CSS field under the General Styling tab in the theme options:

    @media screen and (min-device-width: 1200px) 
      and (max-device-width: 1600px){
    
    a#scroll-top-link {
        display: none;
    }
    }

    Best regards,
    Jordan

    #598100

    Hi Jordan,

    That didn’t seem to work – it produced the opposite effect: hidden on mobile, displaying on desktop. I also tried the below, but that didn’t work either, again showing the reverse of what it should be:

    a#scroll-top-link {
        visibility: visible;
    }
    @media (max-width: 800px) {
      
    
    a#scroll-top-link {
        visibility: hidden !important;
    }
    }
    
    #598130

    Hi!

    Please use the below code to view scroll to top only on mobile :)

    /* Only Mobile */
    @media only screen and (min-width: 769px) {
    a#scroll-top-link {
        display: none!important;
    }
    }
    

    Regards,
    Vinay Kashyap

    #598151

    Hey there!

    Hm, that seemed to hide the “scroll to top” on all devices

    Link to site with the above code in Private Content

    #598166

    Hey!

    We need access to your site to check if there are any other code conflicting and set this up correctly for you please create a temporary user with ‘administrator’ role and share in private content with permission to deactivate all plugins and add custom code if necessary to help you resolve this issue.

    Cheers!
    Vinay Kashyap

    #598172

    Thank you so much for the help!!!

    #599313

    Hey!

    The login credentials you’ve provided do not work please send us working login credentials with user role as ‘administrator’ to resolve the issue.

    However the below code has been tested on our installation and it works perfect! It will enable the scroll to top link only on the mobile screens and disable on tablets and desktops.

    Before adding this code please remove all related codes added earlier so there is no conflict.

    
    @media only screen and (min-width: 769px) {
    #scroll-top-link { display: none !important; }}
    
    @media only screen and (max-width: 768px) {
    #scroll-top-link { display: block !important; }}

    If you still have any issues please send us working login credentials :)

    Best regards,
    Vinay Kashyap

    #599341

    Thank you! That code worked :) Seems it needed the explicit “display: block !important;” if it needed to show, that must be the missing link there. Thank you!! (And sorry about the non-working admin account credentials, strange, but nonetheless this code worked).

    LOVE THIS THEME!

    #599360

    Hey!

    Glad we could help and thank you for the kind words :)

    We really appreciate it if you rate our theme on themeforest!

    Best regards,
    Vinay Kashyap

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.