dropdown-item hover color is not working

Topic: dropdown-item hover color is not working

Matias Miranda Noriega pro asked 8 years ago

I'm trying to get the hover color on the nav dropdown and it appears to not be working.

                            <li class="nav-item btn-group">
                                <a class="nav-link dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="fa fa-user"></i> <span class="hidden-sm-down"> @User.Identity.Name </span> </a>
                                <div class="dropdown-menu" aria-labelledby="dropdownMenu1" data-dropdown-in="fadeIn" data-dropdown-out="fadeOut">
                                    <a class="dropdown-item" asp-controller="Account" asp-action="Account"> Account <i class="fa fa-user" aria-hidden="true"></i> </a>
                                    <a class="dropdown-item" asp-controller="Settings" asp-action="Settings"> Settings <i class="fa fa-gear" aria-hidden="true"></i> </a>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-item" asp-controller="Logout" asp-action="Logout"> Logout <i class="fa fa-sign-out" aria-hidden="true"></i> </a>
                                </div>
                            </li>

Add comment

Bartłomiej Malanowski staff pro premium answered 8 years ago

0 0 Best answer

Did you include js files in your html document?

Add comment

Matias Miranda Noriega pro answered 8 years ago

0 0 Best answer

Yes, I included and verified that Chrome loaded the js files.

            // Layout used bundles
            bundles.Add(new ScriptBundle("~/js").Include(
                        "~/Scripts/jquery-{version}.js",
                        "~/Content/themes/MDB-Pro/js/tether.js",
                        "~/Scripts/bootstrap.js",
                        "~/Content/themes/MDB-Pro/js/mdb.js"));

            bundles.Add(new StyleBundle("~/css").Include(
                        "~/Content/themes/font-awesome-4.6.3/css/font-awesome.css",
                        "~/Content/bootstrap.css",
                        "~/Content/themes/MDB-Pro/css/mdb.css",
                        "~/Content/site.css"));

I did notice that my project is using Jquery 3.0.0.js - I'm assuming you guys are only compatible with the 2.2.3~ one? Uncaught TypeError: parentUl.size is not a function dropdownEffectData @ mdb.js:5995 show.bs.dropdown @ mdb.js:6041 dispatch @ jquery-3.0.0.js:5087 elemData.handle @ jquery-3.0.0.js:4895 trigger @ jquery-3.0.0.js:7995 (anonymous function) @ jquery-3.0.0.js:8063 each @ jquery-3.0.0.js:359 each @ jquery-3.0.0.js:152 trigger @ jquery-3.0.0.js:8062 toggle @ bootstrap.js:1485 dispatch @ jquery-3.0.0.js:5087 elemData.handle @ jquery-3.0.0.js:4895

Add comment

Bartłomiej Malanowski staff pro premium answered 8 years ago