Probablemente mi problema tenga una solución muy fácil ya que soy novato en esto, pero aun no logro hacer lo que quiero, la cosa es que en mi pagina tengo un boton que al ser pulsado dezplaza y devuelve un div fuera y dentro de la pantalla modificando los estilos mediante codigo javascript
Código:
movMenu.style.transform = 'translateX(-100%)';
En el css tengo:
Código:
@media (min-width:1024px){
#menu{
position: static;
transform:translateX(0%);
}
}
En el momento en el que el tamaño de pantalla es mayor a 1024px el boton desaparece por lo que ya no es posible cambiar el estado de transform manualmente, el problema es que ignora la instruccion transform del @media y la propiedad transform se queda en donde se quedo en javascript, en palabras mas simples no puedo cambiar una propiedad css que modifique en javascript.
Tengo al menos una idea de porque se comporta asi, pues me doy cuenta que cuando modifico un estilo por medio de javascript, el estilo se inyecta directamente en la etiqueta correspondiente del html,pero igual quisiera librarme de dudas.