• Resolved muhammadmujadidi

    (@muhammadmujadidi)


    I searched every corner of the internet to find the plugin or a way to use a menu with scrollbar for long menu, here is the example on the following page , the menu on the left :
    http://quran.com/1

    how can i get that for my wordpress site? is there any plugin or something like that?

    thanks in advance

Viewing 12 replies - 1 through 12 (of 12 total)
  • You can do this by css. Can i have your url so that i can code css for this?

    Thread Starter muhammadmujadidi

    (@muhammadmujadidi)

    Here is the link :
    http://goo.gl/cAqJvd

    Hi
    Please place this css code in your .css file.

    .side-nav-right .side-nav {
    max-height: 200px;
    overflow-y: auto;
    }

    Please let me know if its not working.
    Thanks

    Thread Starter muhammadmujadidi

    (@muhammadmujadidi)

    I added those codes to css , but where am i supposed to see the changes?
    i looked in widgets there is nothing and no other difference

    Where you have added the css. Its not reflecting anywhere?

    .menu-tafsir-container {
    max-height: 84px;
    overflow-y: auto;
    }

    .side-nav-right .side-nav {
    max-height: 100px;
    overflow-y: auto;
    }

    Scroll bar only be visible when it will be more than the mentioned height.

    Please let me know if its not working.
    Thanks

    Thread Starter muhammadmujadidi

    (@muhammadmujadidi)

    I added to custom css option of my theme (theme is Avada)
    it works!! but it misses with the arrow which is provided for every menu by the theme i think you can see it in action here :
    http://goo.gl/pOc63f
    is there any solution for that?

    and how can i customize the scroll style according to my needs and how to add outline for the box and some other customizations ?

    And thank you for your time 🙂

    Thread Starter muhammadmujadidi

    (@muhammadmujadidi)

    I think , i can take care of the menu styling , i am not good
    at css but did some searches for css basics and come out with this
    customizations :
    container {
    max-height: 188px;
    background-color: #transparent;
    overflow-y: auto;
    border-color: #336699;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4);
    }
    except scroll bar

    Everything seems to work fine ,but those arrows which
    shifts off the menu , i dont even need them there , any idea how to
    remove them from that menu?

    .sidebar .widget_nav_menu ul li a:before{content:” ” !important;}

    Can you try this.

    Thread Starter muhammadmujadidi

    (@muhammadmujadidi)

    it works!
    thank you very much bro
    you have no idea how badly i wanted this

    جزاک الله خیر

    I am happy that i can help you.

    Cheers

    Thanks Extech! This thread helped me too.

    Welcome

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘menu with scrollbar on sidebar’ is closed to new replies.