There is a code where 'open_menu' is a button (link), and 'header_menu' is a menu. When you click on the button, the menu should appear, and when pressed again, disappear. But instead, the button itself appears and disappears, without clicking on it (like an animation). Tell me where the error is, please.

$(document).ready(function() { $(".open_menu").toggle(function() { $(".header_menu").fadeIn(); return false; }, function() { $(".header_menu").fadeOut(); return false; }); });
  • Find a duplicate of someone - Mr. Black
  • jquery version what? - Alexey Shimansky
  • Version jQuery 3.0.0 - Fantik

2 answers 2

In toggle http://api.jquery.com/toggle/ there is no option to use the toggle function (callback, callback), learn more about this method. Right, for example, like this:

 <!DOCTYPE html> <html> <head> <title>titile</title> <meta charset="utf-8"> <style> </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(function() { $(".open_menu").on('click', function() { $(".header_menu").toggle(); }); }); </script> </head> <body> <input type="button" value="Меню" class="open_menu"> <div class="header_menu">Блок меню</div> </body> </html>

  • Thanks It works! I will continue to be attentive - Fantik

Or so, if necessary with fade :

 <!DOCTYPE html> <html> <head> <title>titile</title> <meta charset="utf-8"> <style> </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(function() { $(".open_menu").on('click', function() { $(".header_menu").fadeToggle(); }); }); </script> </head> <body> <input type="button" value="Меню" class="open_menu"> <div class="header_menu">Блок меню</div> </body> </html>