Desktop menu hides when link is clicked [closed] - javascript

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I am working on a site http://www.kaniamea.com/resource/
For obvious SEO reasons I am using one html code for both navigation - mobile and desktop. The problem is when you see the site in desktop and you click on one of the left hand navigation links. Then the category the clicked link belongs hides (after the click is clicked).
I am not sure what causes this. I would appreciate some tips how to fix that. Thanks!

You have this code that toggles the inside unordered list (ul) for the parent li item clicked:
$('.main-nav li').click(function (){
$(this).addClass('im-curent');
$("ul", this).toggle(100);
});
Since all the links are inside the main li, it will close the menu. To fix this, you can stop propagation for the inner ones like:
$('.main-nav ul').click(function (e){
e.stopPropagation();
});

Related

wordpress Mobile Menu not hidden after click [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
I made a one-page design with some links.
When I browse the site on my smartphone, open the main menu with the button and click on a link (which scrolls to the same page), the mobile menu isn’t hidden but placed on the right site of the content.
this is link http://www.sarahspancakecafe.com.sg/
How to fix that?
Cheers
Try this
$(document).ready(function(){
$('.menu-item-object-custom a').click(function(){
$('.navbar-header button').click();
});
});
I tried it on your site and it seemed to work well.

Active Nav Bar (by only using tags like: nav, main and article) [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I need help with my design. I want an active and fixed nav when it is clicked and/or when it passes h1.
How could I also make article td just be below nav when nav a is clicked? The nav has height: 10%. Therefore, when you click nav a it directs you to h1 with nav.fixed blocking 10% of main.
Would you show me how to write the JavaScript to add the active nav? I don't know how to add another command.
Here is the link to GrafiCode Studio's edit to make the nav work: https://jsfiddle.net/bc5qctce/1. The images are local data, so it is not shown.
You forgot to include jQuery on your fiddle.
Here's your fiddle with jQuery enabled:
Code:
https://jsfiddle.net/bc5qctce/1/
Fixed navbar works :)

How to make the hamurger menu disappear after clicking on an item in menu [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
Here is the link to the website: http://web.ntf.uni-lj.si/~mojcaovnic/.
I would like the menu to disappear when I click on a certain topic/page. I googled it and found some answers but I'm not sure what would work on my website.
Thanks
Here :
$(document).ready(function(){
$('.main-navigation > ul > li').click(function(){
$('.main-navigation').hide();
});
});
You can use Click event on 'li', When li is clicked close sidebar.
Hope this will work.

how to prevent slide down from looping? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I have made script with some menus with the submenu. i use jQuery for the submenu slide down (slidetoggle) animation when hover on the menu. so when i hover and then unhover the menu quickly for couple times, then i moved the cursor away from the menu, the slide down(slidetoggle) animation keep playing/looping equal how many times i hover the menu. what i want is how to make the jquery detect the next "hover" only when the previous slide animation is complete.
Plz help me with the code.
You an try something like that:
$('.menu').on('hover', function(){
$('.submenu').stop().slideToggle();
});
Reference
Hard to answer, when no code is provided.
If you are using .animate() function, you need to insert .stop(true) before .animate(), so it will look like this .stop(true).animate();
You can use .stop() on any function with animations.
I guess that is your problem.

Button that changes it's position/css when clicked and can toggle between show/hide text [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I need 3 buttons that can toggle between show/hide text. When clicked on the button, the button will get smaller (change css) and slide to another position, so the text can be shown at the buttons previous position. Example below:
jsfiddle.net/dRpWv/1/
The toggle function show/hide text is not the problem. The problem is the function to change the buttons css, when clicked.
The simplest way that I can think of is to toggle a class on the button which has the specific styling you wish to apply when the button is clicked.
In your fiddle, it would simply be adding something similar to this in your toggle function.
$(this).toggleClass('clickedButton');
Here is a fiddle based on yours:
http://jsfiddle.net/sm66aLL1/

Categories