-
Cómo ocultar un reproductor de música sin dejar un espacio
-
Un sitio web bien diseñado utiliza el espacio de manera eficiente. Demasiados objetos de una página pueden crear confusión visual y disminuir la capacidad de uso del sitio. Una manera de darle a su sitio respiro es ocultar objetos que un usuario no necesita ver. reproductores de música pueden consumir el espacio valioso, especialmente si son grandes. Puede utilizar la "visibilidad" de propiedad HTML para hacer que un jugador invisible, pero que deja tras de sí un gran espacio vacío. Eliminar ese espacio mediante el uso de JavaScript para ocultar un reproductor de música a la carta.Instrucciones
1 Poner en marcha un editor HTML o el Bloc de notas y abrir una página Web que contiene un reproductor de música.
2 Busque el código HTML que crea el reproductor de música. Si otra persona codifica el jugador HTML para usted, busque un bloque de código similar al siguiente:
<Object width = "400" height = "400">
<Param name = "movie" value = "SomeMusicPlayer.swf">
<Embed ancho = "400" height = "425">
</ Embed>
</ Object>
Se trata de un bloque de "objeto". Contiene el código que los desarrolladores utilizan para incrustar objetos en una página Web. En este ejemplo, el bloque define un reproductor de Flash. Tenga en cuenta que el bloque comienza con una abertura "<objeto>" etiqueta y termina con un cierre "</ object>" etiqueta.
3 Agregue el siguiente código HTML antes de la apertura de etiquetas "<objeto>":
<Div id = "MusicPlayerBlock">
4 Añadir esta línea de código después del cierre "</ object>" tag:
</ Div>
El código que se agrega pone el reproductor de música dentro de un bloque "div". Identificación del bloque div se define como "MusicPlayerBlock."
5 Añadir el código debajo de la etiqueta "</ div> se muestra en la etapa anterior.
<Input id = tipo "HidePlayer" = "button" value = "Hide Player" onclick = "managePlayer ( 'none')" />
<Input id = type = "button" valor "ShowPlayer" = "Mostrar Player" onclick = "managePlayer (" bloque ")" />
Esto crea un botón que esconde el jugador y una que hace que vuelva a aparecer.
6 Añadir el código JavaScript a la sección "<head>" del documento HTML:
<Script language = "javascript" type = "text / javascript">
managePlayer función (acción) {
var playerObject = document.getElementById ( "MusicPlayerBlock");
playerObject.style.display = acción;
}
</ Script>
Cuando un usuario hace clic en el botón "Hide Player", el código se ejecutará, ocultar el reproductor de música. Al hacer clic en el botón "Mostrar Player" hará que el jugador vuelva a aparecer.
7 Guarde el documento HTML que has editado y abrirlo en su navegador. Verá el reproductor de música. Haga clic en el botón "Hide Player". El reproductor de música desaparecerá sin dejar un espacio vacío.
8 Haga clic en el botón "Mostrar Player". El reproductor de música volverá.
Consejos y advertencias
- En este ejemplo, el ID de la etiqueta "div" es de "MusicPlayerBlock." Este nombre coincide con el nombre en la siguiente declaración de JavaScript:
- var playerObject = document.getElementById ( "MusicPlayerBlock");
- Si cambia el nombre de su "div" Identificación de la etiqueta, asegúrese de que cambia el nombre correspondiente en la cuenta de "document.getElementById" también. Los dos nombres deben coincidir.
