Crea unha experiencia de estilo de aplicación nos teus sitios web
O HTML dinámico (DHTML) permítelle crear unha experiencia de estilo de aplicación nos seus sitios web, reducindo a frecuencia de que as páxinas completas están completamente cargadas. Nas aplicacións, cando fas clic en algo, a aplicación cambia inmediatamente para mostrar ese contido específico ou para fornecerche a túa resposta.
En cambio, as páxinas web teñen que ser recargadas, ou se debe cargar unha nova páxina. Isto pode facer que a experiencia do usuario sexa máis disxuntiva. Os teus clientes teñen que esperar a cargar a primeira páxina e agardar outra vez para cargar a segunda páxina, etc.
Usando & lt; div & gt; Mellorar a experiencia do espectador
Usando DHTML, unha das formas máis sinxelas de mellorar esta experiencia é que os elementos div se activan e desactiven para mostrar o contido cando se solicita. Un elemento div define divisións lóxicas na súa páxina web. Pense nunha div como unha caixa que pode conter parágrafos, títulos, ligazóns, imaxes e ata outros divs.
O que necesitas
Para crear unha div que se pode activar e desactivar, necesitará o seguinte:
- Unha ligazón para controlar o div activándoo e desconectalo ao facer clic
- O div para mostrar e esconderse
- CSS para o estilo div oculto ou visible
- JavaScript para realizar a acción
A ligazón de control
A ligazón de control é a parte máis fácil. Simplemente cree unha ligazón como faría noutra páxina. De momento, deixe o atributo href en branco.
Aprende HTMLColócao en calquera lugar da túa páxina web.
A div para mostrar e ocultar
Crea o elemento div que quere mostrar e ocultar. Asegúrese de que o seu div ten unha identificación única nel. No exemplo, o identificador único é aprender HTML .
Esta é a columna de contido. Comeza en branco salvo este texto de explicación. Elixe o que queres aprender na columna de navegación da esquerda. O texto aparecerá debaixo: p> Crea dúas clases para o teu CSS: un para ocultar o div e outro para mostralo. Ten dúas opcións para iso: visualización e visibilidade. A pantalla elimina o div do fluxo da páxina e a visibilidade só cambia como se ve. Algúns codificadores prefiren amosar , pero ás veces tamén ten sentido a visibilidade . Por exemplo: Se queres usar a visibilidade, cambia estas clases a: Engade a clase oculta ao teu div para que comece como oculto na páxina: Todo este script fai é mirar o conxunto de clase actual no seu div e cambialo para que se desactive se está marcado como oculto ou viceversa. Estas son só algunhas liñas de JavaScript. Sitúe o seguinte na cabeza do seu documento HTML (antes da etiqueta Saber HTML h3>
O CSS para mostrar e ocultar a div
JavaScript para facelo funcionar