Tengo una lista desplegable simple, quiero cuando el usuario alterna la lista desplegable para mostrar u ocultar otro div usando el método jquery slideToggle, desafortunadamente, estoy luchando para resolver el problema.
Esperado: cuando el usuario hace clic en un ícono, debería mostrar la lista y ocultar otro div (efecto slideDown) cuando el usuario vuelve a hacer clic para cerrar la lista desplegable (efecto slideUp), quiero mostrar el div oculto .
var link = $('.sprzatanie-link'); link.click(function(e) { e.preventDefault(); list.slideToggle("fast", function(){ console.log('do something') if("slideDown"){ $('.dezynfekcja-dropdown').hide(); }else if("slideUP"){ $('.dezynfekcja-dropdown').show(); } }); });Intenté agregar una función de devolución de llamada, pero no sé cómo verificar el efecto de diapositiva si es slideDown o slideUp.
Cualquier idea será apreciada.
Una vez que la alternancia finaliza, básicamente oculta o muestra el elemento que se alterna. Entonces, en la devolución de llamada complete , simplemente puede verificar si su elemento se muestra u oculta.
var link = $('.sprzatanie-link'); link.click(function(e) { e.preventDefault(); list.slideToggle("fast", function(){ // `this` refers to the DOM element being toggled. // We can use `is(":visible")` to check if it visible or not let isVisible = $(this).is(":visible"); // show console message that tells us if element is hidden or visible console.log(this.innerText, ' is now ', isVisible); // use isVisible to do whatever you want show/hide etc if(isVisible) { $('.dezynfekcja-dropdown').hide(); } else { $('.dezynfekcja-dropdown').show(); } }); });