javascript - jQuery - toggleClass + slideToggle not working as expected -
i relatively new learning html, css , javascript. creating sort of test site, learning purposes , have started diving in mobile responsive websites.
i have test site has mobile navigation button hidden, css media query set display block , hide normal navigation menu. have list items mobile navigation menu. show/hide this, i've created .toggleclass()
jquery function:
function clicktouchmenu() { $('#menuico').on('click touch', function() { var $mobmen = $(".mobilemenu"); $mobmen.toggleclass('clicked'); }); };
the above working, wanted add .slidetoggle()
menu effect. if add in underneath .toggleclass()
$('.clicked').slidetoggle();
menu acts bit strange, if click on menu icon, nothing happens, repeatedly clicking, seems kick in life , start working sliding , down.
as new this, expect doing wrong, or on complicating quite simple.
try removing clicked
class , using slidetoggle()
on mobilemenu
so:
$('#menuico').on('click touch', function() { var $mobmen = $("#mobilemenu") $mobmen.slidetoggle(); });
i think problem if clicked
class toggling whether or not menu shown it's interfering slidetoggle()
. because purpose of slidetoggle()
make it's sliding in , out of view (aka toggling whether or not it's hidden animation). need 1 or other slidetoggle()
includes animation.
i've added fiddle, it's demo don't know html or css like:
fiddle: https://jsfiddle.net/668mucca/3/
link entry on slidetoggle()
in jquery docs measure: http://api.jquery.com/slidetoggle/
Comments
Post a Comment