Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    New Coder
    Join Date
    May 2018
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Same menu structure, same JS/CSS, but no scrolling menu on affected site

    I'm wondering if you could help me with what may be a JS or CSS issue.

    The problem may be related to the site being cobbled together from different 3rd party components - not looking for an essay on how inefficient the coding is please.

    Our site, has a mobile menu at top left that appears at viewport width 800px or less.

    The mobile menu has a scroll bar, which is not working on our site.

    The mobile menu is a duplicate of that found on this site, where the scroll bar does work.

    On both sites, the same related JS and CSS files are being loaded, and in the header and footer, the same JS.

    Help appreciated to see why the mobile menu is not scrolling on our site.

    Thanks.

  2. #2
    Senior Coder low tech's Avatar
    Join Date
    Dec 2009
    Posts
    1,109
    Thanks
    204
    Thanked 137 Times in 137 Posts
    Hi

    in google chrome, maybe you can try keystroke ctrl+shift+i

    check console for errors?

    LT
    0000

  3. #3
    New Coder
    Join Date
    May 2018
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Hi LT,

    The console for the affected site doesn't show any Javascript errors, just some missing resources which shouldn't affect the mobile menu scroll bar.

    Cheers,
    Steve

  4. #4
    Senior Coder low tech's Avatar
    Join Date
    Dec 2009
    Posts
    1,109
    Thanks
    204
    Thanked 137 Times in 137 Posts
    Hi

    Maybe you could compare the source code of both menus to see if they are the same ie same classes used?

    Just an idea

    LT
    0000

  5. #5
    New Coder
    Join Date
    May 2018
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Hi LT,

    Good idea, and I had done that, but not specified so.

    On the affected site, we have:

    Code:
    <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left cbp-spmenu-open" id="cbp-spmenu-s1">
        <div class="mob-menu-content mCustomScrollbar _mCS_1 mCS_no_scrollbar">
            <div id="mCSB_1" class="mCustomScrollBox mCS-light-thin mCSB_vertical mCSB_inside" tabindex="0">
                <div id="mCSB_1_container" class="mCSB_container mCS_no_scrollbar_y" style="position:relative; top:0; left:0;" dir="ltr">
                    <h3>Menu</h3>
                    <div class="primary-mob-menu">
                        <div class="menu-main-menu-container">
                           <ul id="menu-main-menu" class="menu">
    On the working site, we have:

    Code:
    <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left cbp-spmenu-open" id="cbp-spmenu-s1">
        <div class="mob-menu-content mCustomScrollbar _mCS_1 mCS_no_scrollbar">
            <div id="mCSB_1" class="mCustomScrollBox mCS-light-thin mCSB_vertical mCSB_inside" tabindex="0">
                <div id="mCSB_1_container" class="mCSB_container mCS_no_scrollbar_y" style="position:relative; top:0; left:0;" dir="ltr">
                    <h3>Menu</h3>
                    <div class="primary-mob-menu">
                        <div class="menu-nested-pages-container">
                            <ul id="menu-nested-pages" class="menu">
    The only difference is the last div and ul, .menu-main-menu-container #menu-main-menu -vs- .menu-nested-pages-container #menu-nested-pages.

    The Javascript which controls the menu targets .primary-mob-menu .menu, which is the same in both cases.

  6. #6
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Location
    Here
    Posts
    3,763
    Thanks
    58
    Thanked 678 Times in 673 Posts
    I see a difference.
    Your page:
    Code:
    <div class="mob-menu-content mCustomScrollbar _mCS_1 mCS_no_scrollbar">
    Their page
    Code:
    <div class="mob-menu-content mCustomScrollbar _mCS_1">

  7. Users who have thanked xelawho for this post:

    insightdes (Jun 11th, 2018)

  8. #7
    New Coder
    Join Date
    May 2018
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    That's interesting, thank you Xelawho.

    I have searched the Wordpress theme for the non-working site, and found identical instances of `mCS_no_scrollbar` compared to the working site's Wordpress theme.

    The http://www.insightdesign.com.au/wp-c....concat.min.js is the same as http://www.galileomining.com.au/wp-c....concat.min.js, which is the controlling library.

    I've searched the working theme for `scrollbar` and found nothing interesting in terms of configuration values.

  9. #8
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Location
    Here
    Posts
    3,763
    Thanks
    58
    Thanked 678 Times in 673 Posts
    well, googling "mCS_no_scrollbar" pulls up a page full of people complaining about your problem (going back to 2013, ffs). I guess somewhere in there may be your answer, but being that it is obviously a WP plug-in issue I have pretty much zero interest in it. Good luck.

  10. Users who have thanked xelawho for this post:

    insightdes (Jun 11th, 2018)

  11. #9
    New Coder
    Join Date
    May 2018
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thanks again xelawho. I've followed the author's troubleshooting from the github post, but the issue remains. I've added a reply, I hope he responds.

    Why do you avoid Wordpress? Is it because it is bloated? What do you prefer to work with?

    Thanks.

  12. #10
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Location
    Here
    Posts
    3,763
    Thanks
    58
    Thanked 678 Times in 673 Posts
    Why do I avoid WordPress? Oh, wow. I would be surprised if you don't get some impassioned responses to that one, but I'll jump in first...

    First off, it's not a hard and fast rule. I have in the past used it to throw together something quickly and easily that looks ok and will suffice until I've had a time to come up with a better solution.

    But in the long run:
    - Security issues
    - Plug ins not playing nice with each other
    - Code bloat (and over reliance on jQuery would be a sub-point there)
    - Disregard for best practices (particularly in terms of page optimisation which I mentioned to you before)
    - Constant updates from various independent elements mean that any one could break any number of others
    - I find myself spending alot of time trying to wrangle it into doing simple things which I could do myself quite easily.

    And I guess that last point is major. You wouldn't ask a chef why they avoid those heat n eat meals from Woolies, would you? You get to a point with programming where you've done the simple things so many times that they seem to take no time at all. And then you get to a point where you start to enjoy complexity rather than seeking to avoid it, because you know that every time you figure something out for yourself that's another tool in your toolbox and it makes you a better developer. Finding a plug-in that sort of kind of does what you want doesn't really do anything apart from make you a better googler, maybe.

    And I have to admit a part of it is about control. When I write code, I know why every line is on the page and what everything is doing and how it all fits together. With WordPress you throw all of that away and trust that a bunch of unknown developers know what they are doing... and really, having peeked under the hood a few times, I'm not at all convinced.


 

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •