0
174
Viewsagregue css classname y elimine css classname usando jquery según la resolución de pantalla
Estoy intentando agregar un nombre de clase y eliminar un nombre de clase según la resolución usando jquery.
Aquí está mi código Jquery. En modo móvil obtengo totopDesk en modo escritorio obtengo totop_tab solo en modo tableta obtengo la clase correcta. que estoy haciendo mal aqui
function isMobile(){ if($(window).width() <= 575){ return true; } else { return false; } } function isTab(){ if($(window).width() > 575 && $(window).width() <= 992){ return true; } else { return false; } } function isDesktop(){ if($(window).width() >= 992){ return true; } else { return false; } } $(window).resize(function () { if (isMobile()) { goMobile() } else if (isTab()) { goTablet() } else { goDesktop(); } }) function goDesktop() { $("#go_btn").addClass("totopDesk"); $("#go_btn").removeClass("totop_tab"); $("#go_btn").removeClass("totop_mob"); } function goMobile() { $("#go_btn").addClass("totop_mob"); $("#go_btn").removeClass("totopDesk"); $("#go_btn").removeClass("totop_tab"); } function goTablet() { $("#go_btn").addClass("totop_tab"); $("#go_btn").removeClass("totop_mob"); $("#go_btn").removeClass("totop"); $("#go_btn").removeClass("totopDesk"); }sin Jquery simple usando @Media query estoy teniendo este problema
Cuando estoy en modo tableta en el elemento de inspección, la clase 48em se tachó mostrando solo el css de escritorio
1 answers
Answer question0
De acuerdo con su imagen, tiene su consulta de medios en la línea 23 en su archivo main.css, y el resto de su código comienza en la línea 71 en su archivo main.css. Debe mover la consulta de medios después de los estilos principales que está tratando de cambiar. CSS lee de arriba a abajo y aplica la mayoría de los estilos inferiores. Dado que su consulta de medios viene antes que los estilos principales, no se aplica.