Este es mi código y es horizontal en la pantalla del escritorio y en el teléfono es vertical y el botón x (closebtn) solo se muestra en el teléfono y cierra la barra de menú. ¿Cómo lo vuelvo a mostrar automáticamente después de cambiar el tamaño de la página al tamaño del escritorio?
function oty() { document.getElementById("tab").style.display = "none"; } <div class="icon-bar" id="tab"> <button class="closebtn" onclick="oty()">X</button> <button class="tablink">Home</button> <button class="tablink">News</button> <button class="tablink">Contact</button> <button class="tablink">About</button> </div>@mediaPuede agregar fácilmente consultas de medios que determinen la visualización de cualquier elemento dado en función del tamaño de la ventana gráfica, que es la base del diseño receptivo de todos modos. En su caso, manteniendo el marcado como está, el CSS podría ser algo así como...
@media screen and (max-width: 1024px) { // Adjust the break-point size as needed #tab { display: none; } }resize y verifique el tamaño de la ventana gráficaSi bien recomiendo enfáticamente no usar JavaScript para algo para lo que CSS está diseñado, es posible con JavaScript. Prueba algo como seguir.
resize a la ventana: (por ejemplo window.addEventListener('resize', handleResize) )tab .