Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Mobile Menu button only working sometimes and greyed out after clicking menu points #5205

Open
TommiCodes opened this issue Sep 16, 2017 · 1 comment

Comments

@TommiCodes
Copy link

TommiCodes commented Sep 16, 2017

the mobile menu button is not always clickable. When it is clickable and you click on a link you get forwarded to the side and the menu collapses, but then the whole page is having a grey foreground which goes away after one click.

I am using angular 4 and materialize css in the latest version.

Thanks for help.

Friendly Regards

Here is the html:


<header>
<div class="navbar-fixed">
    <nav>
        <div class="nav-wrapper">
            <a href="#/">
                <img class="brand-logo logo" src="assets/logo/smawandi_Logo_RGB_3c.png">
            </a>
            <a href="#" data-activates="mobile-demo" class="button-collapse black-text"><i class="material-icons">menu</i></a>
            <ul class="right hide-on-med-and-down black-text">
                <li><a class="menu-text" href="#/services">Unsere Leistungen</a></li>
                <li><a class="menu-text" href="#">To be speci</a></li>
                <li><a class="menu-text" href="#">New</a></li>
                <li><a class="menu-text" href="#">New</a></li>
            </ul>
        </div>
    </nav>
</div>

<!-- Mobile Menu -->
<ul class="side-nav" id="mobile-demo">
    <div>
        <h2 class="center-align underline-blue menu-text-mobile">Menü</h2>
        <br>
    </div>
    <li><a class="menu-text-mobile" href="#/services"><i class="material-icons">apps</i>Unsere Services</a></li>
    <li><a class="menu-text-mobile" href="badges.html"><i class="material-icons">apps</i>Components</a></li>
    <li><a class="menu-text-mobile" href="collapsible.html"><i class="material-icons">apps</i>Javascript</a></li>
    <li><a class="menu-text-mobile" href="mobile.html"><i class="material-icons">apps</i>Mobile</a></li>
</ul>
</header>

This is one part of my ts file:

$( document ).ready(function(){ $(".button-collapse").sideNav();})

@lucasjinreal
Copy link

Same error, I think this should be fix, the reason why shows this is used navbar-fixed. If not everything normal. Anybody knows solution?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants