Ad
Sub Nav Not Directing To Page (jquery)
I have basic markup for a drop down nav, nested lists.
The user will click on the top nav item, which will open up the sub nav, but my sub nav links aren't working.
It is in a CMS so I must have the links for the placeholder pages there.
Markup:
<ul class="navtop">
<li><a target="_blank" rel="nofollow noreferrer" href="">Who</a>
<ul>
<li><a target="_blank" rel="nofollow noreferrer" href="">Sub Item 1</a></li>
<li><a target="_blank" rel="nofollow noreferrer" href="">Sub Item 2</a></li>
<li><a target="_blank" rel="nofollow noreferrer" href="">Long Sub Item 3</a></li>
<li><a target="_blank" rel="nofollow noreferrer" href="">Sub Item 4</a></li>
</ul>
</li>
<li><a target="_blank" rel="nofollow noreferrer" href="">What</a>
<ul>
<li><a target="_blank" rel="nofollow noreferrer" href="">Sub Item 1</a></li>
<li><a target="_blank" rel="nofollow noreferrer" href="">Sub Item 2</a></li>
<li><a target="_blank" rel="nofollow noreferrer" href="">Long Sub Item 3</a></li>
<li><a target="_blank" rel="nofollow noreferrer" href="">Sub Item 4</a></li>
</ul>
</li>
</ul>
Javascript:
$(".navtop li").click(function(){
$(this).toggleClass("show");
$(this).siblings(".show").toggleClass("show");
return false;
});
css:
#headernav .navtop li.show ul
{
display: block;
}
I tried adding a 'return true' for $(".navtop li ul li a") but it didn't work. Suggestions?
Ad
Answer
Turns out this worked:
$(".navtop > li > a").click(function(){
$(this).parent('li').toggleClass("show");
$(this).parent('li').siblings(".show").toggleClass("show");
return false;
});
Ad
source: stackoverflow.com
Related Questions
- → How to update data attribute on Ajax complete
- → October CMS - Radio Button Ajax Click Twice in a Row Causes Content to disappear
- → Octobercms Component Unique id (Twig & Javascript)
- → Passing a JS var from AJAX response to Twig
- → Laravel {!! Form::open() !!} doesn't work within AngularJS
- → DropzoneJS & Laravel - Output form validation errors
- → Import statement and Babel
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM
Ad